[21.09.17] exam07(05_cssPositioning) - 각기 다른 위치에 글씨 넣기(display, position, border 설정)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
div {
display: inline-block;
position: absolute;
border: 1px solid lightgray;
}
div > p {
display: inline-block;
position: absolute;
width: 15px;
height: 20px;
background: lightgray;
margin: 0;
}
</style>
</head>
<body>
<h3>Merry Christmas!</h3>
<hr>
<p>메리 크리스마스</p>
<div>
<img src="../img/christmastree.png" width="200" height="200" alt="크리스마스 트리">
<p style="left: 50px; top: 30px;">M</p>
<p style="left: 100px; top: 0px;">E</p>
<p style="left: 100px; top: 80px;">R</p>
<p style="left: 150px; top: 110px;">R</p>
<p style="left: 30px; top: 130px;">Y</p>
</div>
</body>
</html>
