5. 웹 애플리케이션 만들기

[Project H4C] 14. CSS이론 기본 문법

도피디 2020. 7. 16. 01:15
반응형

[Project H4C] 14. CSS이론 기본 문법

 

웹 사이트를 아름답게 표현하는 언어. CSS. 

 

 

CSS는 HTML과는 완전히 다른 독립된 언어이다. 

하지만 CSS는 HTML을 떠나서 살 수 없다. 왜냐하면 CSS가 고안된 기본적인 목표가

HTML을 디자인하기 위해서 고안된 것이기 때문이다.

두 언어의 공존을 위해 <style>을 쓰면 된다. 

우선 아톰을 켠다.

 

다큐먼트 루트 말고 다른 루트(e.g. 위 스샷에서는 css폴더) 안에 html을 불러오고 싶다면

http://localhost:8080/css/ex_css_1.html 라고 하면 된다. 

 

여튼, 다시 돌아와서 코딩해보자.



<h1>, <h2>, <h3>에 적용 여부에 따라 각 텍스트들의 크기와 진하기 정도가 달라진다.

 

이렇게..

이제 글자색을 바꿔보자.

style 태그 추가해서 h1 {color:red}를 추가하면

 

h1에 해당하는 CSS가 빨간색으로 변한 것을 알 수 있다.


즉, <style> 태그가 나오면

'이제 CSS 문법을 따라야겠네..' 라고 생각하기!

그리고 </style> 태그가 나오면

'아, 이제 CSS 문법 끝났으니깐 다시 HTML 문법을 따라야겠네..' 라고 생각하면 된다. 


  • 오늘의 문법

👇

 

선택자: 누구에게 적용시킬 것인가. 

서술: 어떤 효과를 선택자에게 줄 것인가. 

 

반응형