안녕하세요 한가지 여쭤 보려고 합니다. 채택완료
안녕하세요
서브 페이지에 상단에 이미지가 화면이 줄여지면 상단 이미지가 너무 많이 줄여져서요
혹시 왜 그러는 것인지 궁금 ㅎ바니다.
http://www.jisim.or.kr/theme/basic3/page/company_1.php">http://www.jisim.or.kr/theme/basic3/page/company_1.php
죄송합니다.
실력이 별로 없어서요
답변 2개
</span></p><p style="margin-left: 40px;"><span style="font-size: 9pt;">.box_sub</span><span style="font-size: 9pt;">_slider img {</span></p><p style="margin-left: 40px;"><span style="font-size: 9pt;"> height: 100%;</span></p><p style="margin-left: 40px;"><span style="font-size: 9pt;">}</span></p><p style="margin-left: 40px;"><span style="font-size: 9pt;">@media all and (max-width: 991px) {</span></p><p style="margin-left: 80px; font-size: 14.6667px;"><span style="font-size: 9pt;">.box_sub</span><span style="font-size: 9pt;">_slider img {</span></p><p style="margin-left: 80px; font-size: 14.6667px;"><span style="font-size: 9pt;"> height: auto;</span></p><p style="margin-left: 80px; font-size: 14.6667px;"><span style="font-size: 9pt;">}</span></p><p style="margin-left: 40px;"><span style="font-size: 9pt;">}</span></p><p><span style="font-size: 9pt;">
안녕하세요. 인아이디어입니다.
해당 이미지의 높이값이 지정되어있지 않아서, 가로 크기에 비해서 세로 크기가 자동으로 조절되는 현상입니다.
(반응형에서 많이 쓰는 방식입니다.)
해당 클래스의 이미지는 전체적으로 높이를 조절 해주시는 편이 좋습니다.
테스트해보니 이미지를 교체하시는 편도 좋은 방법인것같습니다.
가로 크기에 비해서 세로 크기가 너무 어중간합니다.
아니시면 img 태그를 지우시고, .box_sub_slider 에 background로 주시면 이미지 깨짐 현상을 없앨 수 있습니다
(단지 이미지가 좌우가 약간씩 잘려서 나올 수 있습니다.)
</span></p><p style="margin-left: 40px;"><span style="font-size: 12px;">.box_sub_slider {</span></p><p style="margin-left: 40px;"><span style="font-size: 12px;"> background: url(<a href="<a href="http://www.jisim.or.kr/theme/basic3/img/sub_img.png)" target="_blank" rel="noopener noreferrer">http://www.jisim.or.kr/theme/basic3/img/sub_img.png)</a>"><a href="http://www.jisim.or.kr/theme/basic3/img/sub_img.png)" target="_blank" rel="noopener noreferrer">http://www.jisim.or.kr/theme/basic3/img/sub_img.png)</a></a> no-repeat center center;</span></p><p style="margin-left: 80px;"><span style="font-size: 12px;">background-size : cover;</span></p><p style="margin-left: 40px;"><span style="font-size: 12px;"> width: 100%;</span></p><p style="margin-left: 40px;"><span style="font-size: 12px;"> height: 172px;</span></p><p style="margin-left: 40px;"><span style="font-size: 12px;">}</span></p><p style="margin-left: 40px;"><span style="font-size: 12px;"></span></p><p><span style="font-size: 12px;">
이런식으로 하셔도 될것같습니다.
개인적으로는 background 방식을 추천합니다.
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
@꿈의세계
1. 딱히 빠진 부분은 없습니다.
2. 이렇게 하시면 될것같습니다.
</span></p><p style="margin-left: 40px;"><span style="font-size: 9pt;"><style></span></p><p style="margin-left: 40px;"><span style="font-size: 9pt;">.box_sub_slider {</span></p><p style="margin-left: 40px;"><span style="font-size: 9pt;"> background-size : cover;</span></p><p style="margin-left: 40px;"><span style="font-size: 9pt;"> width: 100%;</span></p><p style="margin-left: 40px;"><span style="font-size: 9pt;"> height: 172px;</span></p><p style="margin-left: 40px;"><span style="font-size: 9pt;">}</span></p><p>
</p><p style="margin-left: 40px;"><span style="font-size: 9pt;"></style></span></p><p>
</p><p style="margin-left: 40px;"><span style="font-size: 9pt;"><div class="box_sub_slider" id="nav01" style="background:url(<?=$sub_title_img?>) no-repeat center center; ></div> </span></p><p><span style="font-size: 9pt;">
3. 채택 부탁드립니다 :)
답변에 대한 댓글 1개
감사 드립니다.
혹시여 매인 베너 같은 경우에는 어떻게 처리 하나요
화면이 줄여 졌을때 이미지가 이상하게 나오는 상태라서요
http://www.jisim.or.kr/index,php
죄송합니다.
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
background-size : cover; 이부분에 앞에 혹시 .이 빠진건지요
궁금 합니다.
아 그리고
switch($pn) {
case "company_1":
$sub_title1="대표이사 인사말"; $step1="조합소개"; $step2="대표이사 인사말";
$sub_title_img = G5_THEME_URL . '/img/sub_img.png';
break;
이것을 사용을 하고 있습니다.
이것은 이미지 경로 지정 해 놓으면 그냥 나오게 되는 것이지요
지금 서브 페이지 상단 이미지 같은 경우에는 아래와 같이 코딩을 했습니다.
<div class="box_sub_slider" id="nav01"><p><img src="<?=$sub_title_img?>" alt=""></p></div>
그런데 위 소스를 여기에 대입을 하려고 하면 어떻게 해야 하는지 궁금 합니다.