728x90
์ฝ๋->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
#wrapper{
width: 600px;
height: 600px;
margin: 0 auto;
}
#left{
width: 200px;
float: left;
}
.red{
background-color: red;
width: 200px;
height: 500px;
}
.yellow{
background-color: yellow;
width: 200px;
height: 100px;
}
#center{
width: 200px;
float: left;
}
.blue{
background-color: blue;
width: 200px;
height: 200px;
}
.green{
background-color: green;
width: 200px;
height: 400px;
}
#right{
width: 200px;
float: left;
}
.black{
background-color: black;
width: 200px;
height: 300px;
}
.pink{
background-color: pink;
width: 200px;
height: 300px;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="left">
<div class="red">red</div>
<div class="yellow">yellow</div>
</div>
<div id="center">
<div class="blue">blue</div>
<div class="green">green</div>
</div>
<div id="right">
<div class="black">black</div>
<div class="pink">pink</div>
</div>
</div>
</body>
</html>
'๐ HTML\CSS' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
๐ ๋ค์ด๋ฒ ๋ก๊ทธ์ธ ์ฐฝ ๋ง๋ค๊ธฐ ๐ (0) | 2021.03.17 |
---|---|
Header/Main/Footer ๋ธ๋ก ์์ญ ๋๋๊ธฐ ์์ (0) | 2021.02.26 |
Table์ CSS์ ์ฉ (0) | 2021.02.25 |
List ์ CSS ์ ์ฉ, ์ด๋ฏธ์ง ์ถ๊ฐ (0) | 2021.02.25 |
ํ์ดํผ ๋งํฌ ํด๋ฆญ์ ๋์ ์ด๋ฏธ์ง ์ถ๊ฐ - link, hover, visited, active๋ฑ (0) | 2021.02.25 |
๋๊ธ