CSS 강의목차
4. CSS 박스모델(padding,margin,border,content)
지난시간에는 스타일태그를 이용해서 글자의 색깔을 바꿨습니다.
이번시간에는 스타일속성을 이용해서 글자의 색깔을 바꿔보겠습니다.
1. 스타일 속성으로 글자 색깔 바꾸기
색깔을 바꾸고 싶어하는 곳에 style="color:red" 이라는 속성을 지정해주면 됩니다.
쉽습니다!!!
2. 밑줄제거하는 속성 적용해보기
링크가 걸려있는 내용에 밑줄이 왠지 보기싫으시죠?
이 밑줄을 제거하는걸 한번 해보겠습니다.
<head> 태그 아래에 있는 스타일태그에서
text-decoration:none; 를 추가해줍니다.
결과를 한번 볼까요?
아래와 같이 링크에 밑줄이 사라진걸 확인할 수 있습니다.
이번에는 CSS 파일링크에 밑줄을 한번 그어볼께요.
속성태그를 활용해서 아래와 같이 적용하면 됩니다.
style = "color:red; text-decoration:underline" 요렇게 추가하시면 되요
<li><a href=2.html style="color:red; text-decoration:underline">CSS</a></li>
결과를 한번 볼까요?
짜잔!!! 어렵지 않죠?
3. CSS 스타일태그(선택자, 정의, 속성 등)에 대한 개념정리
자, 지금까지 배운걸 한번 정리해봅시다!!
a는 이 웹페이지에 있는 모든 a태그를 선택한다는 의미에서 선택자(Selector)이라고 합니다.
Color:red는 선택자가 선택한것에 대해서 어떠한 효과를 주는가라는 의미에서 선언(Declaration) 또는 효과라고 합니다.
그리고 선언된 Color:red는 첫번째 color는 속성(property)라고 하고 red는 속성(property)의 값이라고 하여 Value라고 합니다.
아래 생활코딩 강의안을 바탕으로 일부 수정,편집하여 재작성된 강의안입니다.
opentutorials.org/course/3086/18318
'블록체인교육 > 웹프로그래밍' 카테고리의 다른 글
[CSS] 4. CSS 박스모델(padding,margin,border,content) (0) | 2020.10.07 |
---|---|
[CSS] 3. CSS 속성과 선택자에 대한 이해 (0) | 2020.10.07 |
[CSS] 2. 스타일속성(선택자,정의,속성) 개념정리 (0) | 2020.10.07 |
[CSS] 1. CSS 시작, 글 색깔 바꿔보기 (0) | 2020.10.07 |
[HTML] 10. 서버와 클라이언트 이해하기 (0) | 2020.10.07 |
[HTML] 9. 나만의 홈페이지(웹사이트) 만들어보기 (0) | 2020.10.07 |
댓글0