div 태그공부-2 css

div 태그의 매력은 css에 있다고 해도 과언이 아닐 듯 합니다.

 

오늘 시간은 css를 본격적으로 배우기 전 기본 이해로 보면 될 거 같네요~

기존 HTML 태그는 하나의 파일에 모든 것이 들어가 있었습니다.

물론 변형해서 사용하기도 했지만

기본은  [이름.HTML] 파일만 있으면 디스플레이까지 다 되었지요~

 

그러나 div 태그를 사용할 경우 따로 css파일이 필요합니다

 

예를 들면 일반적으로 작업할 경우

skin.html 과 style.css  이렇게 두가지로 저장합니다.

 

그리고 css 파일의 경우 여러개가 생길 수도 있기때문에

image 폴더를 만들어서 이미지들을 관리하는 것처럼

css 폴더를 만들어서 관리하기도 합니다.

 

 

css 파일에 기본적으로 들어가는 소스는 아래와 같습니다

 

----------------------------------------------------

 

@charset "utf-8";

body {background-color:#CCCCCC}

a,input {selector-dummy :expression(this.hideFocus=true); text-decoration:none}

img {-ms-interpolation-mode:bicubic; border:none;}

 

-------------------------------------------------------

 

첫 번째 줄은 최상단에 필수적으로 들어가야 하는 내용으로,

유니코드를 utf-8로 불러들이는 것입니다.

 

두 번째 줄의 body에 배경색을 설정해 보았습니다.

body에 배경색을 설정하면 온 화면에 색이 채워지는 것입니다.

 

세 번째 줄은 링크된 곳에 클릭하면 생기는 점선테두리를 없애기 위해 넣어보았는데,

몇몇 브라우저에서는 먹지 않습니다.

점선테두리가 그다지 거슬리지 않으시면 세 번째 줄을 삭제하셔도 됩니다.

 

마지막 줄은 이미지파일을 원본보다 크거나 작게 출력할 때

이미지가 깨져 보이는 익스플로러의 '이미지 계단현상' 을 방지하기 위해서 넣습니다.

 

---------------------------------------------------------

 

다음 시간부터는 본격적으로 css를

활용하는 법을 배워보도록 하겠습니다.