반응형최신글에서 그누보드초기설치처럼 박스로 둘러싸고싶은데...(ETY테마)
본문
ETY테마반응형 최신글에서 그누보드초기설치처럼 박스로 둘러싸고 싶은데 css파일에서 수정해야하는걸로
알고있습니다만.........어디있는지 못찾겠네요......
방법좀 알려주시면 감사하겠습니다.
를 아래와같이 박스로둘러싸고싶습니다.
에티테마의 최신글은 basic이고
style..css소스코드는
@charset "utf-8";
/* 새글 스킨 (latest) */
.lat {position:relative;margin-bottom:20px;overflow:hidden;border: 1px solid #c6cacc;background:#fff}
.lat .lat_title {display:block;padding:0 20px;line-height:45px;font-size:1.083em;border-bottom:1px solid #e2e2e2;color:#253dbe;background:#fcfcfc}
.lat .lat_title a{color:#253dbe;display:inline-block;position:relative}
.lat .lat_title a:after{position:absolute;bottom:-1px;left:0;width:100%;height:2px;background:#253dbe;content:''}
.lat ul{padding:15px 20px}
.lat li {position:relative;line-height:18px;padding:3px 0;padding-right:50px;padding-left:10px}
.lat li:before{position: absolute;top: 12px;left: 0px;width: 4px;height: 4px;background: #aaa;content: '';border-radius: 50%;}
.lat li a:hover{color:#a22121}
.lat li .fa-heart{color:#ff0000;}
.lat li .fa-lock{display: inline-block;line-height: 14px;width: 16px;font-size: 0.833em;color: #4f818c;background: #cbe3e8;text-align: center;border-radius: 2px;font-size: 12px;border:1px solid #a2c6ce}
.lat li .new_icon{display:inline-block;width: 16px;line-height:16px;font-size:0.833em;color:#ffff00;background:#6db142;text-align:center;border-radius: 2px;}
.lat li .hot_icon{display:inline-block;width: 16px;line-height:16px ;font-size:0.833em;color:#fff;background:#e52955;text-align:center;border-radius: 2px;}
.lat li .fa-caret-right{color:#bbb}
.lat .lt_date{position:absolute;top:3px;right:0;color:#888}
.lat .empty_li{line-height:145px ;color:#666;text-align:center;padding:0;}
.lat .empty_li:before{background:none;padding:0}
.lat .lt_cmt{background:#5c85c1;color:#fff; font-size:11px;height:16px;line-height:16px;padding:0 5px;border-radius:3px;
-webkit-box-shadow: inset 0 2px 5px rgba(255,255,255,0.4);
-moz-box-shadow: inset 0 2px 5px rgba(255,255,255,0.4);
box-shadow: inset 0 2px 5px rgba(255,255,255,0.4);}
.lat .lt_more {position:absolute;top:11px;right:10px;display:block;width:25px;line-height:25px;color:#aaa;border-radius:3px;text-align:center;}
.lat .lt_more:hover{color:#777}
/* 새글 스킨 (lat_leftest) */
/*
:root {
--icon_new : #03a9f4;
--text_color : #666666;
}
*/
.lat_left {position:relat_leftive;margin-bottom:20px;overflow:hidden;order-right: 1px solid #c6cacc;background:#fff}
.lat_left .lat_left_title {display:block;padding:0 20px;line-height:45px;font-size:1.083em;border-bottom:1px solid #e2e2e2;color:#253dbe;background:#fcfcfc}
.lat_left .lat_left_title a{color:#253dbe;display:inline-block;position:relat_leftive}
.lat_left .lat_left_title a:after{position:absolute;bottom:-1px;left:0;width:100%;height:2px;background:#253dbe;content:''}
.lat_left ul{padding-top:15px; padding-left:10px;}
.lat_left li {position:relat_leftive;line-height:18px;padding:3px 0;padding-right:50px;position:relat_leftive}
.lat_left li a{padding-left:0px;}
.lat_left li:before{position: absolute;top: 12px;left: 0px;height: 4px;content: '';border-radius: 50%;}
.lat_left li a:hover{color:#a22121}
.lat_left li .fa-heart{color:#ff0000;}
.lat_left li .fa-lock{display: inline-block;line-height: 14px;width: 16px;font-size: 0.833em;color: #4f818c;background: #cbe3e8;text-align: center;border-radius: 2px;font-size: 12px;border:1px solid #a2c6ce}
.lat_left li .new_icon{display:inline-block;width: 16px;line-height:16px;font-size:0.833em;color:#ffff00;background: #03a9f4;text-align:center;border-radius: 2px;}
.lat_left li .hot_icon{display:inline-block;width: 16px;line-height:16px ;font-size:0.833em;color:#fff;background:#e52955;text-align:center;border-radius: 2px;}
.lat_left li .fa-caret-right{color:#bbb}
.lat_left .lt_date{position:absolute;top:3px;right:0;color:#888}
.lat_left .empty_li{line-height:145px ;color:#666;text-align:center;padding:0;}
.lat_left .empty_li:before{background:none;padding:0}
.lat_left .lt_cmt{background:#5c85c1;color:#fff; font-size:11px;height:16px;line-height:16px;padding:0 5px;border-radius:3px;
-webkit-box-shadow: inset 0 2px 5px rgba(255,255,255,0.4);
-moz-box-shadow: inset 0 2px 5px rgba(255,255,255,0.4);
box-shadow: inset 0 2px 5px rgba(255,255,255,0.4);}
.lat_left .lt_more {position:absolute;top:11px;right:10px;display:block;width:25px;line-height:25px;color:#aaa;border-radius:3px;text-align:center;}
.lat_left .lt_more:hover{color:#777}
.left_profile_img {
position: absolute;
right: 30px;
}
.left_profile_img img {
border: 1px solid #bbb;
border-radius: 50%;
width: 22px;
height: 22px;
}
latest.skin.php소스는
<?php
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가
// add_stylesheet('css 구문', 출력순서); 숫자가 작을 수록 먼저 출력됨
add_stylesheet('<link rel="stylesheet" href="'.$latest_skin_url.'/style.css">', 0);
?>
<div class="lat">
<h5 class="lat_title"><a href="<?php echo G5_BBS_URL ?>/board.php?bo_table=<?php echo $bo_table ?>"><?php echo $bo_subject ?></a></h5>
<ul>
<?php for ($i=0; $i<count($list); $i++) {
if($list[$i]['wr_1']) {
$list[$i]['subject'] = conv_content($list[$i]['wr_subject'], 1);
} ?>
<li>
<?php
if ($list[$i]['icon_secret']) echo "<i class=\"fa fa-lock\" aria-hidden=\"true\"></i><span class=\"sound_only\">비밀글</span> ";
if ($list[$i]['icon_new']) echo "<span class=\"new_icon\">N<span class=\"sound_only\">새글</span></span>";
if ($list[$i]['icon_hot']) echo "<span class=\"hot_icon\">H<span class=\"sound_only\">인기글</span></span>";
if ($list[$i]['comment_cnt']) echo "
<span class=\"lt_cmt\">+ ".$list[$i]['comment_cnt']."</span>";
echo "<a href=\"".$list[$i]['href']."\"> ";
if ($list[$i]['is_notice'])
echo "<strong>".$list[$i]['subject']."</strong>";
else
echo "<span data-toggle=\"tooltip\" data-placement=\"right\" title='".$list[$i]['datetime2']."'>".$list[$i]['subject']."</span>";
echo "</a>";
// if ($list[$i]['link']['count']) { echo "[{$list[$i]['link']['count']}]"; }
// if ($list[$i]['file']['count']) { echo "<{$list[$i]['file']['count']}>"; }
//echo $list[$i]['icon_reply']." ";
// if ($list[$i]['icon_file']) echo " <i class=\"fa fa-download\" aria-hidden=\"true\"></i>" ;
//if ($list[$i]['icon_link']) echo " <i class=\"fa fa-link\" aria-hidden=\"true\"></i>" ;
?>
</li>
<?php } ?>
<?php if (count($list) == 0) { //게시물이 없을 때 ?>
<li class="empty_li">게시물이 없습니다.</li>
<?php } ?>
</ul>
</div>
`입니다..........
!-->!-->답변 2
에티테마를 사용해본적이 없어서 어떤 클래스를 수정하시라곤 말씀드리기 힘듭니다만
의뢰를 요청할정도의 상황은 아닌것 같네요.
기본 베이직 테마를 기준으로 간단하게 설명드리자면
베이직 pc버전의 css 파일인 default.css 파일에서 .container 부분(본문 페이지가 클래스가 이게 맞는지도 가물가물하네요)에서 background:#eee 를 추가해서 본문의 백그라운드 색상을 연한 회색으로 설정하시고
최신글 스킨은 적어주신 최신글 스킨기준으로 보면 8번째 라인의 <div class="lat">를 참고로
해당 최신글 스킨의 style.css 파일에서 .lat 클래스를 찾아서 background:#fff; border:1px solid #666; 정도로 추가하시면 될것 같습니다.
죄송합니다만, 질문이 아니라 의뢰같습니다.
뭔가 시도했고 잘안된다는식으로 질문바랍니다.
답변을 작성하시기 전에 로그인 해주세요.