CSS 이론2
CSS는 태그 별로 기본 디자인을 가지고 있음
CSS를 통해서 모든 디자인을 바꿀 수 있다.
실습 1 : h1태그의 글자 사이즈를 바꾸고 싶다.
font-size:xxpx 사용
속성과 속성의 구분 => ;
h1 {
color:red;
font-size:10px
}
실습 2 : h2태그도 h1태그와 같은 효과를 주고 싶다.
h1, h2 {
color:red;
font-size:10px
}
실습 3 : 실습 2의 속성은 유지하고 h2에만 밑줄을 긋고 싶다.
h1, h2 {
color:red;
font-size:10px
}
h2 {
text-decoration:underline;
}
실습 4 : header태그 밑에있는 h1에만 효과를 주고 싶다.
- <h1>CSS</h1>을 header태그로 감싼 후에 header h1으로 구현 가능
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
h1, h2 {
color:red;
font-size:10px
}
h2 {
text-decoration:underline;
}
header h1{
border:1px solid red;
}
</style>
</head>
<body>
<header>
<h1>CSS</h1>
</header>
<h2>JavaScript</h2>
<h3>HTML</h3>
<h1>PHP</h1>
</body>
</html>
border => 테두리
'웹 프로그래밍' 카테고리의 다른 글
CSS 이론 - float (0) | 2017.12.17 |
---|---|
CSS 이론 - 박스모델 (0) | 2017.12.17 |
CSS 이론1 (0) | 2017.12.16 |
개발도구 - 아톰 (0) | 2017.12.16 |
HTML실습 (0) | 2017.12.14 |