css 기초이론 - 박스모델 Box-Model(border, margin, padding)
HTML, CSS 2021. 1. 14. 23:55반응형
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Box-Model</title>
<style>
h1 {
border: 1px solid crimson;
padding: 20px;
}
</style>
</head>
<body>
<h1>Hello, World</h1>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Box-Model</title>
<style>
b {
border: 1px solid crimson;
padding: 20px;
}
</style>
</head>
<body>
<b>Hello, World</b>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Box-Model</title>
<style>
b {
border: 1px solid crimson;
padding: 20px;
margin: 20px;
}
</style>
</head>
<body>
<b>Hello, World</b>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Box-Model</title>
<style>
h1 {
border: 1px solid crimson;
padding: 20px;
margin: 20px;
}
</style>
</head>
<body>
<h1>Hello, World</h1>
</body>
</html>
반응형
'HTML, CSS' 카테고리의 다른 글
css기초이론 - 포지셔닝 엘리먼트 보이고 감추가 (z-index, visibility, opacity, display) (0) | 2021.01.15 |
---|---|
css기초이론 - CSS포지셔닝 - 엘리먼트 배치하기 (속성 : position, fixed) (0) | 2021.01.15 |
css기초이론 - 레이아웃 스타일(block/inline element) (0) | 2021.01.14 |
CSS 기초이론 - 배경 제어하기 (background-attachment) (0) | 2021.01.14 |
css 기초이론 - 배경 제어하기 (background-position) (0) | 2021.01.14 |