CSS 검색 결과
6 개의 검색 결과가 있습니다.
서평단 기록/IT 컴퓨터

[서평/리뷰] 길벗_코딩 자율학습 HTML+CSS+자바스크립트

웹코딩을 하려 한다면 기본적으로 HTML, CSS, 자바스크립트를 알아야 한다. 세 가지 기능이 잘 버무려졌을 때 멀끔한 디자인과 기능을 가진 웹페이지가 탄생할 수 있다. 처음에는 '하나도 벅찬데 3가지를 다?'라는 생각이 살짝 들지만, 한 번만 잘 익혀두면 금방 금방 다음 단계로 너머갈 수 있게 된다. 그래서 오늘은 HTML, CSS, 자바스크립트의 입문서를 리뷰해보려 한다. 캐릭터가 상당히 인상깊은 표지이다...^^;; 이 책의 저자분도 원래 개발 전공자는 아니었다고 한다. 대학 전공과 무관하게 우연히 들어서게 된 개발자의 길을 10년이 넘는 지금까지 꾸준히 걷고 있습니다. (중략) 코딩은 분야가 상당히 방대한데, 그중 우리가 일상생활에서 쉽게 접할 수 있는 웹 페이지도 코딩을 배우면 만들 수 있는 ..

2022. 5. 10. 15:28
웹개발/css

스크롤 해도 고정되는 배너 CSS

.fixedBanner { position: fixed; top: 40%; /*창 상단에서부터의 거리*/ right: 0px; /*창 우측에서부터의 거리*/ width: 100px; /*너비 지정*/ height: 100px; /*높이 지정*/ z-index: 999; /*요소 중 가장 앞쪽으로 배치*/ }

2021. 8. 25. 12:02
웹개발/css

CSS 깜빡이는 blink 애니메이션 & 바운스 bounce 애니메이션

.blinkClass { -webkit-animation: blink .3s infinite alternate; -moz-animation: blink .3s infinite alternate; animation: blink .3s infinite alternate; } @-webkit-keyframes blink { 0% {color: #0e4bef; border-color: #0e4bef;} 100% {color: #a9a9a9; border-color: #a9a9a9;} } @-moz-keyframes blink { 0% {color: #0e4bef; border-color: #0e4bef;} 100% {color: #a9a9a9; border-color: #a9a9a9;} } @keyframes ..

2021. 7. 30. 10:54
웹개발/css

CSS BEM의 10가지 일반적 문제와 해결 방법 1

BEM이 유용하다는 것은 알겠지만 막상 적용하려 하니 어려운 게 한두 가지가 아니다. 그래서 검색을 좀 해봤는데 좋은 글이 영어로 있어 번역을 해두려 한다. 번역기 돌려서 조금 다듬는 정도지만 원문: Battling BEM CSS: 10 Common Problems And How To Avoid Them 1. 자손 선택자의 경우 어떻게 해야 하나요? 두 수준으로 중첩된 요소를 참조해야 할 때 자손 선택자를 사용할 것입니다. 이 녀석들은 내 인생의 골칫거리이고, 나는 자손선택자의 오용이 사람들로 하여금 BEM에 즉시 혐오감을 갖게 하는 이유 중 하나라고 확신합니다. 예를 들어보죠. Title text here Lorem ipsum dolor sit amet, consectetur Adipiscing eli..

2021. 7. 16. 07:40
웹개발/css

CSS 파일 구분

CSS는 파일을 구분해서 관리한다. 너무 당연한 이야기지만 이제야 알았다 이래서 막 배우는 게 문제야 보통 많이 쓰이는 파일은 다음과 같다. reset.css : HTML 기본 속성값을 초기화 common.css : 웹사이트 기본 설정값. 글꼴, 배경, 제목, 네비게이션바, 테이블, 버튼 등 layout.css : 웹사이트의 레이아웃 main.css : 메인 board.css : 게시판용 세상에 쉬운 일은 없다. 내가 쉽게 하면 쉬운 일이 되는 거고, 어렵게 하면 어려운 일이 되는 거지... 모든 일을 어렵게 하는 장인이 되고 싶다.

2021. 7. 14. 11:12
웹개발/css

CSS 애니메이션

내가 보려고 정리하는 코드 코드는 확실히 복사-붙여넣기 하는 습관을 버려야 한다 귀찮더라도 내 손으로 써버릇해야 외워진다ㅠㅠ.. .bg { width: 1400px; height: 260px; position: relative; background: url(background.jpg) center/1400px no-repeat; } .runner { position: absolute; margin-top: 170px; width: 50px; height: 100px; animation-name: running; animation-timing-function: linear; animation-iteration-count: infinite; background: no-repeat; background-siz..

2021. 7. 14. 10:40