<CSS3> 3강 CSS기본 규칙

CSS 기본 규칙

네이밍 규칙

파일 네이밍시 (html/css 동일)

- 포함할 수 있는 문자는 영문(대소문자), 숫자, _, - 까지 허용된다.

- 처음 시작글자는 영문 소문자로만 시작할 수 있다.

- 조합 형태는 -> 의미 -> 순서 -> 상태를 기본 순서로 사용한다.

- 단어의 조합으로 네이밍시 띄어쓰기 대신 _(언더스코어) 를 사용한다.

 

파일내 태그 네이밍시

- 모든 속성은 숫자, 대문자, 특수문자로 시작할 수 없으며, 영문 소문자로만 작성한다.

- 2가지 단어를 조합하여 표현할 때 "카멜표기법 =>noticeTitle", "_(언더스코어)표기법 => notice_title" 을 사용한다.

- 1,2 와 같은 한자리 정수는 사용하지 않으며 01, 02와 같이 네이밍 하여 사용할것을 권장한다.

- 방향에 따라 속성을 지정해야 하는 경위 top, right, bottom, left 시계방향 순으로 작성한다.

- css는 들여쓰기를 하지 않는다.

- 주석 기호와 내용 사이에는 반드시 공백이 한 칸 있어야 한다. 

- 구분할 목적으로 넣은 빈 줄은 한줄을 넘기지 않는다.

- 불필요한 공백을 최소화 한다.

- 클래스와 클래스간 교차속성(한 태그에 두 개의 속성이 동시에 선언되는 것)을 사용하지 않는다. 

- css컬러는 웹컬러인 #000을 권장한다.

- 속성값이 0이면 단위를 표시하지 않는다.

- 상하좌우의 속성값이 동일하면 축약한다.

 

 

CSS기본형태

태그 {스타일 속성(Property): 값(value);...}

- CSS는 여러가지 속성을 한꺼번에 적용할 때가 많은 이럴경우 ;(세미콜론) 을 사용해서 속성과 속성을 구분한다.

    ex) body {font-size:20pt; color : red)

- 여러가지 태그에 같은 스타일을 적용할 수 있다

    ex) h1, ul, p {font-size:20pt; color : red)

- 여러가지 태그에 같은 스타일을 적용하는데 부모 자식관계가 성립되는 태그라면 ,(쉼표) 를 사용하지 않아도 된다.

    ex) ul li {font-size:20pt; color : red)

- selector (선택자)를 속성을 이용해 레이아웃과 스타일을 자유롭게 지정할 수 있다. 

 

주석

CSS 주석은 /*내용 */

HTML 주석은 <!-- 내용 --!> 

 

- 실행시 수행되지 않는다

- 문자열을 메모처럼 사용할 수 있다.

- 가독성을 위해서 위치위치에 적절히 사용해야 한다.

- 단축키 comman + /