1) css 는 rgb로 색을 표현
- rgb: red green blue 빛
- 표현방법:
1. #ffff00 두개씩 나눔 (00~FF)
2. rgba(255,255,0,0.5) ,로 나눔
3. blue 이렇게 바로 해도 됨
rgba의 a(alpha)는 투명도, 0.0~1.0(투명~불투명) 0.0 fully transparent and 1.0 fully opaque
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<style>
/*테그명은 아무것도 없이*/
body{
background-color: #ffff00;
}
/* . 은 class*/
.a1{
color: violet;
}
.a5{
color: rgba(255,255,0,0.5);
}
/*#은 id*/
#a7{
color: blue;
font-size: 50px;
}
</style>
<body>
<div class="a1">클래스1</div>
<div class="a5">클래스2</div>
<div id="a7">아이디1</div>
</body>
</html>
2) border padding margin
border는 테두리 크기
padding은 글씨와 테두리와의 간격
margin은 두 테이블 사이의 간격(둘다 겉의 테두리)
padding:20px (상우하좌 4개 모두 20px)
padding:20px 30px (상 우) (상하 20 좌우 30)
padding:20px 30px 50px 70px (상 우 하 좌)
padding:20px 30px 50px (상 우 하) 좌는 우처럼 30px
3)
.disstyle ul li 이건 disstyle 클래스 안에 ul 안에 li
#aa, #bb, #cc 이건 id aa, bb, cc 모두
'[front-end] > CSS' 카테고리의 다른 글
Semantic (0) | 2021.01.11 |
---|---|
CSS 속성 (0) | 2021.01.08 |