-
· html에서의 <font></font> 태그
<font color="red">WEB</font>
· css에서의 color
<head>
<style>
a{
color:red;
}
</style>
</head>
-> 중복의 제거
웹페이지 유지보수, 가독성 측면에서 효과적
html이 정보에 전념하기 위해서! 디자인은의 기능은 css에서
· css 사용법
(1) <style></style> 태그 안에 쓰기
ex) <style>
a(<-선택자, selector) {
color: black; (<-선언, declaration)(property:value;)
}
</style>(2) style 속성 사용
ex) <li><a href="2.html" style="color:red">CSS</a></li>
· text-decoration: none; (밑줄 제거)
· text-decoration: underline; (밑줄 생성)
· font-size: 45px; (글씨 크기 조절)
· text-align: center; (글씨 중앙 정렬)
· class
<style>
.saw{ (saw라는 클래스를 가진)
color: gray;
}
.active{ (active라는 클래스를 가진)
color: red;
}
</style>(class는 여러 개 지정 가능, 띄어쓰기로 구분함)
<body>
<li><a href="1.html" class="saw">HTML</a></li>
<li><a href="2.html" class="saw active">CSS</a></li> (active의 영향을 받음(순서대로 적용됨))</body>
· id
<style>
#active{
color: red;
}</style>
<body>
<li><a href="2.html" class="saw" id="active">CSS</a></li>
</body>
id의 우선순위가 class의 우선순위 보다 높음
(id 선택자>class 선택자>태그 선택자)
같은 형태라면 가장 마지막에 등장하는 것이 우선순위가 가장 높음
id의 값은 하나만! (중복x)