[CSS] 웹 프로젝트 5일차! (CSS의 기본 문법 & margin)

오늘은 CSS를 처음 배우는 날이다.

CSS를 HTML에 적용하는 방법부터 기본 문법, 특징까지 차근차근 배워 보았다.

 

CSS를 HTML에 적용하는 방법)

1) HTML script 자체에 적용하는 방법

<style>    </style> 

style 태그 안에 CSS 코드를 작성하면 된다.

 

2) CSS script를 HTML 파일에 적용하는 방법

<link href="style.css" rel="stylesheet" />

link 태그를 사용해서 style.css란 만들어놓은 css파일을 html파일에 연결해주면 된다.

 

 

기본 문법)

selector { property: value; }

"selector에 value 값의 property를 적용한다."라고 이해하면 편하당ㅎㅎ

{} 는 스타일 범위의 시작을 의미한다.

 

ex)

<style>

      h1 {

        color: blue;

        font-size: 20px;

      }

    </style>

이런식으로 적용하면 된다!!

 

특징)

CSS의 Box의 특징은 총 3가지로

margin border pading 이다.

오늘은 그중

margin을 살펴봤당!!

margin)

-> 요소 외부 여백으로 브라우저에 기본값이 설정되어 있다.

margin: 20px;

이런식으로 해서 margin 값을 변경할 수 있다.

 

다음 시간에는 나머지 두 특징인

border 와 pading에 대해 자세히 공부해보장!!

벌써부터 어떻게 웹을 디자인하게 될지 기대된당 ㅎㅎㅎ

CSS 요녀석 참으로 맘에 들었당! 크핫!