텍스트 정렬... 채택완료
<div class="main_image">
<img src="/thema/Basic/images/fixer1.jpg" width="100%" height="100%">
<h1 class="main_image_text">
<a href="<?php echo G5_BBS_URL;?>/board.php?bo_table=notice" style="font-size:50px; color: white;">현식재단사</a>
</h1>
<h2 class="main_image_text2" style="font-size:30px">손쉽게 신체사이즈 알맞게 측정하는 방법</h2>
<h3 class="main_image_text3" style="font-size:20px">보통 집에 줄자 가지고 계신가요? 없는분들 많을거라 생각합니다. 그렇다면 손쉽게 신체사이즈 알맞게 측정 하는 방법 하나씩 배워보겠습니다. </h2>
</div>
<style>
.main_image {
position: relative;
}
.main_image_text {
position: absolute;
top: 50%;
left: 50%;
transform: translate( -50%, -50% );
color: white;
}
</style>
<style>
.main_image {
position: relative;
}
.main_image_text2 {
position: absolute;
top: 53%;
left: 20%;
transform: translate( -50%, -50% );
color: white;
}
</style>
<style>
.main_image {
position: relative;
}
.main_image_text3 {
position: absolute;
top: 56%;
left: 20%;
transform: translate( -50%, -50% );
text-align:center;
color: white;
}
</style>
이미지 안에서 H1은 중앙 정렬을 두고 h2 부터는 이미지의 좌측부터 맞추고 싶은데... 어떻게 설정해야 되나요 ㅠㅠ 정렬이 안되서 고수님들 부탁드리겠습니다. 구글링에서 찾지 못해서 ㅠㅠ 이렇게 글남깁니다.
답변 1개
</p>
<p><!DOCTYPE html></p>
<p><html lang="en"></p>
<p><head></p>
<p> <meta charset="UTF-8"></p>
<p> <meta name="viewport" content="width=device-width, initial-scale=1.0"></p>
<p> <title>Document</title></p>
<p> <style></p>
<p> html,body{</p>
<p> width: 100%;</p>
<p> height: 100%;</p>
<p> }</p>
<p> .main_image {</p>
<p> position: relative;</p>
<p> height: 100%;</p>
<p> background: url("/thema/Basic/images/fixer1.jpg") center center no-repeat;</p>
<p> }</p>
<p> .main_image_text {</p>
<p> text-align: center;</p>
<p> }</p>
<p> .main_image_text a {</p>
<p> color: #fff;</p>
<p> font-size: 50px;</p>
<p> }</p>
<p> .main_image_text2 {</p>
<p> color: #fff;</p>
<p> font-size: 30px;</p>
<p> }</p>
<p> .main_image_text3 {</p>
<p> color: #fff;</p>
<p> font-size: 20px;</p>
<p> }</p>
<p> </style></p>
<p></head></p>
<p><body></p>
<p> <div class="main_image"></p>
<p> <h1 class="main_image_text"></p>
<p> <a href="<?php echo G5_BBS_URL;?>/board.php?bo_table=notice">현식재단사</a></p>
<p> </h1></p>
<p> <h2 class="main_image_text2">손쉽게 신체사이즈 알맞게 측정하는 방법</h2></p>
<p> <h3 class="main_image_text3">보통 집에 줄자 가지고 계신가요? 없는분들 많을거라 생각합니다. 그렇다면 손쉽게 신체사이즈 알맞게 측정 하는 방법 하나씩 배워보겠습니다. </h2></p>
<p></div></p>
<p></body></p>
<p></html></p>
<p>
정렬은 앱솔루트로 쓰지마세요 정말 안좋은 버릇입니다.
이미지 때문에 어쩔 수 없는 거라면 배경으로 사용하시면 됩니다.
답변에 대한 댓글 2개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인