Codeit_기본 CSS 속성 정리

---

기본 CSS 속성 정리

---

 

 

우리가 만든 사이트에 스타일을 입히기 위해 CSS를 사용한다.

HTML은 사이트에 들어갈 내용을 담고, 이 내용을 스타일링 하는 것은 CSS 이다.

사이트에 CSS 스타일을 입혀주기 위해서 <style> 태그를 사용 한다.

<style> 태그 사이에 CSS 코드를 써주면 사이트에 스타일이 반영된다.

CSS 기본문법

스타일링 하고 싶은 요소 {   바꾸고 싶은 속성: 원하는 속성 값;   }

속성값은 들여쓰기로 작성하고, 콜론(:) 뒤에만 띄어쓰기를 한 칸 해주고 세미콜론(;)을 꼭 작성한다.

 

폰트 크기

CSS에서 폰트 크기를 표현할 수 있는 단위 몇 가지가 있는데, 그 중 픽셀(px)이 가장 많이 사용된다.

 ex) h1 {

             font-size: 24px;

         }

 

텍스트 정렬

글은 왼쪽, 가운데 또는 오른쪽으로 정렬할 수 있다.

 ex) h1 {

             text-align: left; (defalt)

             text-align: right;

             text-align: center;

         }

 

텍스트 색

글에 색을 입히고 싶으면 color 속성을 사용한다.

ex) h1 {

             color: blue;

         }

 

여백

margin 속성을 사용하면 요소 사이의 여백을 설정할 수 있다.

여백의 크기도 픽셀(px) 단위로 설정해주면 된다.

ex) h1 {

             margin: 40px;

             margin-top: 40px;

             margin-bottom: 40px;

             margin-left: 40px;

             margin-right: 40px;

         }