목차
접기
728x90
반응형
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>백분율 단위</title>
<style>
p:nth-child(1) {
}
p:nth-child(2) {
font-size: 100%;
}
p:nth-child(3) {
font-size: 150%;
}
p:nth-child(4) {
font-size: 200%;
}
#first {
/* background-color: rgb(255, 222, 100); */
background-color: rgba(0, 0, 0, 0.3);
/* alpha 값은 0.0(완전 투명), 1.0(완전 불투명) */
}
</style>
</head>
<body>
<!--<h1>백분율 단위로 나타낸 문장</h1>-->
<!-- %단위는 기본으로 설정된 크기를 기준으로 상대적인 크기를 지정할 때 사용하면 유용하다.-->
<p id="first">Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
</body>
</html>
😶 rgba(255, 255, 255, 1.0)
- alpha 값은 0.0(완전 투명), 1.0(완전 불투명)
728x90
반응형
LIST
'HTML, CSS' 카테고리의 다른 글
레이아웃 구조 복습, display 속성(a태그 default : inline) (0) | 2021.06.14 |
---|---|
웹 사이트 표준 (utf-8, meta 태그, 언어 설정, link 태그 등 ) (0) | 2021.06.14 |
가상 클래스 (2) (0) | 2021.06.08 |
가상 선택자 (0) | 2021.06.08 |
CSS 속성 선택자 (0) | 2021.06.08 |