-
css
.profile {
width: 35px;
height: 35px;
border-radius: 50%;
margin-left: 5px;
float: left;
}
.name {
display: block;
font-size: 15px;
margin-left: 50px;
}
.time {
margin-left: 51px;
font-size: 12px;
color: rgba(0, 0, 0, 0.5);
}
.title {
font-size: 18px;
margin-left: 5px;
margin-top: 15px;
}
.paragraph {
float: left;
color: rgba(0, 0, 0, 0.5);
margin-top: -5px;
margin-left: 5px;
}.mainjpg {
float: left;
width: 150px;
height: 150px;
}html
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="css/main.css" />
<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>Document</title>
</head>
<body>
<div>
<div>
<div>
<img src="wolf.jpg">
</div>
<div class="name">이우리</div>
<div class = "time"><span>1시간 전</span></div>
</div>
<div>
<div><h1 class="title">4k빔프로젝터 가성비 최강으로 선택했어요.</h1></div>
</div>
</div>
<div>
<div>
<div><p class="paragraph">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Laudantium harum autem molestias nobis aut delectus illo consequuntur voluptates excepturi consectetur ea in veritatis eaque, quo cumque, quas numquam at odio?
</p></div>
<img src="projector.jpg">
</div>
</div>
</div>
</body>
</html>
- 답변은 로그인 후 가능합니다.