-
안녕하세요.
레이아웃만들기 숙제를 했습니다.
그런데 선생님 해설코드와 달라서요.
저는 이런식으로 짯는데 코드는 달라도 모습이 비슷하면 숙제를 했다고 볼수 있을까요?
그리고 저는 박스를 많이 나눈것 같은데 어느정도까지 박스를 나누는게 좋을지 궁금합니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Document</title>
<link href="/css/hwlayout.css" rel="stylesheet" />
</head>
<body>
<div class="container">
<div class="pcontent">
<div class="headline">
<div class="user_info">
<img src="lion.png">
<div class="temp">
<p class="name">라이온킹</p>
<p class="time">1시간전</p>
</div>
<h3 class="header">사과 가성비 최강으로 선택했어요</h3>
</div>
</div>
<div class="main">
<p class="maincontent">
사과를 가성비최강으로 선택했어요 날씨가 날씨인지라 요즘 마음이
싱숭생숭한게 가을타는 사람이 아닌 봄을 타고 있었어요.... 하루하루
시간이 무의미하게 흘러가는거 같고 재미있는걸 찾지못해 이리저리
헤메는 사람처럼 즐걸운걸 못찾고있...
</p>
<div class="footer">
<button class="share">공유</button>
</div>
</div>
</div>
<div class="imgcontent">
<img src="apples.jpeg">
</div>
</div>
</body>
</html>.container {
width: 800px;
height: 200px;
padding: 10px;
}
.pcontent {
width: 70%;
height: 200px;
float: left;
}
.headline {
width: 100%;
height: 40%;
margin: 10px;
}
.user_info {
width: 70%;
float: left;
}
.profile {
width: 10%;
float: left;
}
.temp {
float: left;
padding: 0px;
margin-top: 5px;
margin-left: 10px;
}
.name {
margin: 0px;
float: left;
}.time {
color: grey;
}
.header {
clear: both;
margin: 0px;
}.main {
float: left;
margin: 10px;
}
.maincontent {
width: auto;
color: grey;
}
.footer {
width: 100%;
}
.share {
width: auto;
height: auto;
float: right;
}.imgcontent {
margin: auto;
width: 30%;
height: 200px;
float: left;
}
.product {
width: 90%;
height: 90%;
padding: 10px;
}
- 답변은 로그인 후 가능합니다.