[오늘의 학습] 211113
HTML, CSS 웹 페이지 구현 실습 input 태그 창, 로그인 버튼, SNS 계정 버튼의 width, height, border-radius, 정렬 상태(가운데)가 공통점이 있어서 클래스 명을 일치시켜줬다.(클래스명 : 'box') CSS 작성 시, 나름의 코딩 컨벤션 기준을 세워서 작성했다. 레이아웃 설정해주는 값은 상단에 작성하고, 시각적으로 설정해주는 값은 하단에 작성했다. section을 구분하여 작성했다. 요소들 전반적인 정렬 방식으로 margin, padding, relative, absolute, translate, text-align을 적극 활용했다. 타입 조건이 'text', 'password'인 input 태그의 placeholder 스타일링 하기 placeholder의 폰트 색깔..
[오늘의 학습] 211111
CSS CSS 설계 기법 OOCSS(Object Oriented CSS) 레고처럼 여러가지 모듈을 만들어서 조합하는 방법론 구조와 스킨을 분리 구조 : width, height, padding, margin 등 레이아웃 관련 속성 스킨 : font 관련 속성, color, background 등 시각적인 영향을 주는 속성 컨테이너와 컨텐츠 분리 SMACSS(Scalable and Modular Architecture for CSS) CSS 코드를 역할(베이스, 레이아웃, 모듈, 스테이트, 테마)에 따라 분류 베이스 : 표준 스타일 정의(폰트 패밀리, reset CSS 등) 레이아웃 : 큰 틀을 구성하는 태그(header, main, footer 등)에 id 선택자 적용 모듈 : 레이아웃 내 배치된 모든 ..