<HTML에서 CSS를 적용하기>
1) style 태그 사용 (<style>, </style>)
-ex)
<style>
a {
color:red;
}
</style>
- head부분에 작성
- a: 선택자 (selector), color:red;: 선언(declaration)
- 선택자(selector): 어느 부분을 ‘선택’해 태그를 적용할 것인지 나타낸다.
- 선택자 필요 O: 어느 부분에 style 태그의 효과를 적용할 것인지 지정해주는 과정이 필요하기 때문
2) style 속성 사용 (HTML의 style 속성)
-ex) <a href="2.html" style="color:red">
- CSS를 감싸고 있는 a 태그에다가 직접 CSS 코드를 기입
- 그냥 color:red라고 작성 시 웹 브라우저 입장에서는 html인지 css인지 알 수가 없기 때문에 style이라는 속성을 사용하기로 약속
- style 속성을 쓰면 속성의 값을 CSS의 문법에 따라 해석해서 style 속성이 위치하고 있는 태그에 적용
- 선택자 필요 X: CSS의 효과를 적용할 부분에 직접 style 속성 기입하기 때문
<CSS를 지배하는 두 가지 중요한 토대>
1) 선택자 (selector)
-a (selector): 이 웹페이지에 있는 모든 a 태그를 선택
2) 효과(속성)
- 중괄호 안의 내용: declaration(=선언 or 효과)
- color:red; : 빨간색 적용
- text-decoration: none; : 밑줄 없애기
- color, text-decoration -> 속성(property)
- red, none -> 속성값(value)
- 폰트 크기 속성
font-size:50px; //폰트 사이즈 50픽셀로
- 텍스트 배열 위치 속성
text-align:center; //텍스트 배열 센터로
+)하나의 description 끝을 구분하기 위해 새미 콜론(;)기입
+) 목차의 CSS 부분만큼은 밑줄을 남기고 싶으면
<li><a href="2.html" style="color:red;text-decoration:underline">CSS</a></li>
→ CSS부분 a 태그에 직접 text-decoration:underline 기입
