본문 바로가기
프로그래밍/html

css 기초 정리

by -현's- 2012. 5. 20.
반응형

html, xml 등은 문서의 구조를 정의한다.
css 는 문서의 표현을 정의한다.

 

 

●html에서 구조를 나타내기 위해 사용하는 요소들

div, span, ul, ol, dl, h1~h6, p, table 등이 있다.

 

 

●css는 html의 각 구조를 시각적 표현으로 꾸며준다.

 

 

●css의 기본 규칙

- 선택자 {속성: 값; }

ex)

body {background-color: gray; }

 

 

●css의 선택자

- 스타일을 적용할 대상으로, body, p, h1 등 html의 요소명이나 id명,class명을 사용할 수 있다.

 

●css의 속성

- 해당 선택자의 어떤 스타일을 부여할지 결정한다.

 

●class 선택자와 id 선택자

- 특정 요소를 대상으로 스타일을 적용하기 위해 사용한다.

- id선택자는 사용할때 #을 쓰고 class선택자는 사용할때 .을 쓴다.

ex)

#abc {font-weight:bold;}

.def {color:gray;}

 

<p id = "abc"> ABC</p>

<p class = "def">DEF</p>

 

 

●css의 선언

- 외부파일을 불러들여 선언하는 방법

ex)

<head>

<link rel="stylesheet" type="text/css" href="css파일의 위치/css파일 이름.css"/>

</head>

 

- head범위 안에 @import로 외부 스타일시트를 참조하는 방법

ex)

<head>

<style type="text/css">

@import url("/css위치/css파일이름.css");

</style>

</head>

 

 

 

 

반응형

댓글