연혁 스킨 질문입니다.
본문
https://sir.kr/g5_skin/16421?sfl=wr_subject%7C%7Cwr_content&stx=%EC%97%B0%ED%98%81
위 스킨을 적용중입니다.
일단 첫번째 질문은
여기 보시면 1월 8월 11월 순으로 정렬이 되어있는데,
이걸 반대로 11월 8월 1월 순으로 (역순으로) 바꾸고싶습니다.
또한
이 부분의 간격을 더 좁히거나 넓히고 싶은데 이럴 땐 어떻게 해야할까요?
style.css 파일은 아래와 같습니다.
ul,ol,li{list-style:none}
.mt5{margin-top:5px}
.mt10{margin-top:10px}
.mt15{margin-top:15px}
.mt20{margin-top:20px}
.mt25{margin-top:25px}
.mt30{margin-top:30px}
.mt35{margin-top:35px}
.mt40{margin-top:40px}
.mt45{margin-top:45px}
.mt50{margin-top:50px}
.mt55{margin-top:10px}
.mt60{margin-top:60px}
.p_box{width:100%;overflow:hidden}
.sub_txt{margin-top:10px;padding-top:35px;border-top:1px solid #e7e7e7;letter-spacing:-0.5px}
.history_div p{padding:0;}
.history_div{background:url('../img/history_line.gif') repeat-y 110px 0}
.history_img{width:200px;position:relative;float:left;margin-right:50px;padding-left:10px;text-align:center;min-height:40px;}
.history_img .year_body {width:200px;height:80px;background:#999 url('../img/bg_pattern.png') repeat;
-webkit-border-top-left-radius: 20px;
-moz-border-top-left-radius: 20px;
border-top-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-bottom-right-radius: 20px;
border-bottom-right-radius: 20px;
}
.history_img .year_body.first {background-color:#c11717;}
.history_img span{position:absolute;top:10px;left:18px;right:0;display:block;text-align:center;color:#fff;font-size:3em;font-family:"NanumGothicBold"}
.history_txt{float:left;margin-top:20px}
.history_txt .tit{position:relative;font-size:30px;color:#444;padding-top:6px}
.history_txt .tit .bar{position:absolute;top:0;left:0;width:15px;height:1px;background:#555}
.history_txt p{font-size:13px;color:#888;line-height:18px;text-align:justify;}
.history_icon{width:130px;float:right;}
.history_icon {height:80px;overflow:hidden;border-bottom:1px solid #e7e7e7}
.history_icon img{width:100%;height:auto;}
.history_icon strong{color:#e13137}
.history_icon .tit{margin-top:2px;font-size:10px;color:#888}
.history_img,
.history_icon,
.history_txt {opacity:0}
/* 게시판 목록 */
#bo_cate {border-bottom: 1px solid #e7e7e7;position:relative;margin-top:-33px;}
#bo_cate h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_cate ul {margin-bottom:27px;width:710px;zoom:1;}
#bo_cate ul:after {display:block;visibility:hidden;clear:both;content:""}
#bo_cate li {float:left;margin-bottom:-1px}
#bo_cate a {display:block;font-size:16px;position:relative;padding:0 2em 0 3px;color:#888;
font-family:"ProximaNovaWeb", "NanumGothic"}
#bo_cate #bo_cate_on {z-index:2;color:#e13137;}
.td_subject img {margin-left:3px}
/* 게시판 목록 공통 */
.bo_fx {margin-bottom:5px;padding:5px 10px}
.bo_fx:after {display:block;visibility:hidden;clear:both;content:""}
.bo_fx ul {margin:0;padding:0;list-style:none;text-align:right}
#bo_list_total {float:left;padding:0;height:2.5em;line-height:2.5em}
.btn_bo_user {float:right;margin:0;padding:0;list-style:none}
.btn_bo_user li {float:left;margin-left:5px}
.btn_bo_adm {float:left}
.btn_bo_adm li {float:left;margin-right:5px;vertical-align:top;}
.btn_bo_adm li a{padding:8px;border:0;background:#eee;color:#777;text-decoration:none;vertical-align:middle;display:inline-block}
.btn_bo_adm input {padding:8px;border:0;background:#000;color:#fff;text-decoration:none;vertical-align:middle}
.bo_notice td {background:#f7f7f7}
.bo_notice td a {font-weight:bold}
.td_num strong {color:#000}
a.bo_cate_link {color: #fff;background: #333;font-size: 0.92em;padding: 3px 5px;display: inline-block;}
.bo_current {color:#e8180c}
.td_subject img {margin-left:3px}
#bo_list .cnt_cmt {display:inline-block;margin:0 0 0 3px;font-weight:bold}
#bo_list {padding:20px}
#bo_sch {margin-bottom:10px;padding-top:5px;text-align:center}
#bo_sch select{height:30px;}
#bo_sch .btn_sch{height:30px;border:0;background:#444;color:#fff;padding:0 5px}
/*
.btn_bo_adm input {padding:0 10px;height:25px;border:1px solid #e8180c !important;background:#e8180c;color:#fff;text-decoration:none;vertical-align:middle;cursor:pointer}
*/
.bo_notice td {background:#f5f6fa}
.bo_notice td a {font-weight:bold}
.td_num strong {color:#000}
.bo_cate_link {display:inline-block;margin:0 3px 0 0;padding:0 6px 0 0;border-right:1px solid #e7f1ed;color:#999 !important;font-weight:bold;text-decoration:none} /* 글제목줄 분류스타일 */
.bo_current {color:#e8180c}
.cnt_cmt {font-weight:bold}
#bo_sch {margin-bottom:10px;padding-top:5px;text-align:center}
#bo_sch legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
/* 게시판 쓰기 */
#wrapper_title {margin-bottom:20px;font-size:1.4em;letter-spacing:-1px;font-family: 'Arial', 'Malgun gothic', sans-serif;}
#autosave_wrapper {position:relative}
#autosave_pop {display:none;z-index:10;position:absolute;top:24px;right:117px;padding:8px;width:350px;height:auto !important;height:180px;max-height:180px;border:1px solid #565656;background:#fff;overflow-y:scroll}
html.no-overflowscrolling #autosave_pop {height:auto;max-height:10000px !important} /* overflow 미지원 기기 대응 */
#autosave_pop strong {position:absolute;font-size:0;line-height:0;overflow:hidden}
#autosave_pop div {text-align:right}
#autosave_pop button {margin:0;padding:0;border:0;background:transparent}
#autosave_pop ul {margin:10px 0;padding:0;border-top:1px solid #e9e9e9;list-style:none}
#autosave_pop li {padding:8px 5px;border-bottom:1px solid #e9e9e9;zoom:1}
#autosave_pop li:after {display:block;visibility:hidden;clear:both;content:""}
#autosave_pop a {display:block;float:left}
#autosave_pop span {display:block;float:right}
.autosave_close {cursor:pointer}
.autosave_content {display:none}
.btn_confirm p {padding-bottom:10px}
.frm_tbl td.td_not_input {padding:13px 10px;}
.frm_tbl td [type="checkbox"] {margin-right:3px;}
.frm_tbl td input[name="secret"] {margin-left:10px;}
.btn_confirm p {padding-bottom:10px !important}
/* 게시판 댓글 */
#bo_vc {padding:20px 20px 10px;border-top:1px solid #cfded8;border-bottom:1px solid #cfded8;background:#f5f6fa}
#bo_vc h2 {margin-bottom:10px}
#bo_vc article {padding:0 0 10px;border-top:1px dotted #ccc}
#bo_vc header {position:relative;padding:15px 0 5px}
#bo_vc header .icon_reply {position:absolute;top:15px;left:-20px}
#bo_vc .sv_wrap {margin-right:15px}
#bo_vc .member, #bo_vc .guest, #bo_vc .sv_member, #bo_vc .sv_guest {font-weight:bold}
.bo_vc_hdinfo {display:inline-block;margin:0 15px 0 5px}
#bo_vc h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_vc a {color:#000;text-decoration:none}
#bo_vc p {padding:0 0 5px;line-height:1.8em}
#bo_vc p a {text-decoration:underline}
#bo_vc_empty {margin:0;padding:20px !important;text-align:center}
#bo_vc fieldset {margin:0 0 10px;padding:0}
#bo_vc #bo_vc_winfo {float:left}
#bo_vc footer {zoom:1}
#bo_vc footer:after {display:block;visibility:hidden;clear:both;content:""}
.bo_vc_act {float:right;margin:0;list-style:none;zoom:1}
.bo_vc_act:after {display:block;visibility:hidden;clear:both;content:""}
.bo_vc_act li {float:left;margin-left:5px;letter-spacing:-1px}
#bo_vc_w {position:relative;margin:0 0 10px;padding:0 0 20px;border-bottom:1px solid #cfded8}
#bo_vc_w h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_vc_w #char_cnt {display:block;margin:0 0 5px}
#bo_vc_sns {margin:0;padding:0;list-style:none;zoom:1}
#bo_vc_sns:after {display:block;visibility:hidden;clear:both;content:""}
#bo_vc_sns li {float:left;margin:0 20px 0 0}
#bo_vc_sns input {margin:0 0 0 5px}
#bo_vc form {padding:0}
한편 list_skin.php 파일은 아래와 같습니다.
<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
include_once(G5_LIB_PATH.'/thumbnail.lib.php');
include_once $board_skin_path."/board_head.skin.php";
add_stylesheet('<link rel="stylesheet" href="'.$board_skin_url.'/css/style.css">', 20);
add_stylesheet('<link rel="stylesheet" href="'.$board_skin_url.'/css/lightbox.css">', 21);
?>
<div class="sub_con widthfix">
<div class="history_div mt55">
<form name="fboardlist" id="fboardlist" action="./board_list_update.php" onsubmit="return fboardlist_submit(this);" method="post">
<input type="hidden" name="bo_table" value="<?php echo $bo_table ?>">
<input type="hidden" name="sfl" value="<?php echo $sfl ?>">
<input type="hidden" name="stx" value="<?php echo $stx ?>">
<input type="hidden" name="spt" value="<?php echo $spt ?>">
<input type="hidden" name="page" value="<?php echo $page ?>">
<input type="hidden" name="sw" value="">
<!-- 게시판 목록 시작 -->
<?
$sql = "SELECT * FROM $write_table ORDER BY wr_subject $board[bo_4], wr_1, wr_2 ";
$result=sql_query($sql);
//$num_rows = mysql_num_rows($result);
$count = 0;
while($data=sql_fetch_array($result)) {
$count++;
$hList[]=$data;
if($preYear != $data[wr_subject]) {
$preYear = $data[wr_subject];
if($count > 1) {
$cicle_img = '<div class="year_body"><span>'.$data[wr_subject].'</span></div>';
}elseif($count == 1){
$cicle_img = '<div class="year_body first"><span>'.$data[wr_subject].'</span></div>';
}
echo ' <div class="p_box '.$margin_top.'">';
echo ' <div class="history_img">'.$cicle_img.'</div>';
echo ' <div class="history_txt">';
$tmp_write_table = $g5['write_prefix'] . $board['bo_table']; // 게시판 테이블 전체이름
$sql_detail = " select * from {$tmp_write_table} where wr_subject = {$data[wr_subject]} order by wr_subject $board[bo_4], wr_1, wr_2 ";
$result_detail = sql_query($sql_detail);
$history_icon = '';
for ($i=0; $hList = sql_fetch_array($result_detail); $i++) {
if($i == 0) {
if($i > -1) $margin_top = "mt30";
echo '<div class="tit">';
echo ' <h4>'.$hList[wr_subject].'</h4>';
echo '</div>';
}
$disp_month = $hList[wr_1];
$disp_day = $hList[wr_2];
if($board[bo_3]=="d") {
$display = $disp_month."월 ".($disp_day == '00' ? "" : $disp_day."일 ");
}else{
$display = $disp_month."월";
}
echo '<p class="mt5">';
if($is_admin || $is_checkbox) echo '<input type="checkbox" name="chk_wr_id[]" value="'.$hList[wr_id].'" title="'.$hList[wr_subject].'"> ';
if($is_admin) {
echo ' <a href="'.G5_BBS_URL.'/write.php?bo_table='.$bo_table.'&w=u&wr_id='.$hList[wr_id].'">';
}
echo $display.rtrim(nl2br($hList[wr_content]));
if ($is_admin)
{
set_session("ss_delete_token", $token = uniqid(time()));
$delete_href ='./delete_all.php?bo_table='.$bo_table.'&wr_id='.$hList[wr_id];
echo ' </a> ';
echo '<a href="javascript:del(\''.$delete_href.'\');"><img src="'.$board_skin_url.'/img/btn_close.gif" alt="Delete" width="12px" height="11px" /></a>';
}
echo '</p>';
$thumb = get_list_thumbnail($bo_table, $hList['wr_id'], $board['bo_gallery_width'], $board['bo_gallery_height']);
$sql = " select bf_file, bf_content from {$g5['board_file_table']}
where bo_table = '$bo_table' and wr_id = '$hList[wr_id]' and bf_type between '1' and '3' order by bf_no limit 0, 1 ";
$row = sql_fetch($sql);
if($thumb['src']) {
$history_icon .= '<div class="history_icon">';
$history_icon .= '<strong>'.$hList[wr_subject].'</strong>';
$history_icon .= '<p class="tit">'.$thumb['alt'].'</p>';
$history_icon .= '<p class="mt5"><a href="'.G5_DATA_URL.'/file/'.$bo_table.'/'.$row['bf_file'].'" data-lightbox="history-image-set" class="light-box-image"><img src="'.$thumb['src'].'" alt="'.$thumb['alt'].'" width="'.$board['bo_gallery_width'].'" height="'.$board['bo_gallery_height'].'"></a></p>';
$history_icon .= '</div>';
}
}
echo ' </div>';
echo $history_icon;
echo ' </div>';
}
}
?>
<div class="p_box">
<div class="history_img"><img src="<?=$board_skin_url?>/img/history_start.gif" style="position:absolute;bottom:0;left:105px;" alt="history_start"></div>
<div class="history_txt">
</div>
</div>
</div>
<div class="mt40"></div>
<?php if ($is_admin || $list_href || $is_checkbox || $write_href) { ?>
<div class="bo_fx">
<?php if ($is_checkbox) { ?>
<ul class="btn_bo_adm">
<li><input type="submit" name="btn_submit" value="선택삭제" onclick="document.pressed=this.value"></li>
<li><input type="submit" name="btn_submit" value="선택복사" onclick="document.pressed=this.value"></li>
<li><input type="submit" name="btn_submit" value="선택이동" onclick="document.pressed=this.value"></li>
</ul>
<?php } ?>
<?php if ($list_href || $rss_href || $write_href) { ?>
<ul class="btn_bo_user">
<?php if ($rss_href) { ?><li><a href="<?php echo $rss_href ?>" class="btn_b01">RSS</a></li><?php } ?>
<?php if ($admin_href) { ?><li><a href="<?php echo $admin_href ?>" class="btn_admin">관리자</a></li><?php } ?>
<?php if ($list_href) { ?><li><a href="<?php echo $list_href ?>" class="btn_b01">목록</a></li><?php } ?>
<?php if ($write_href) { ?><li><a href="<?php echo $write_href ?>" class="btn_b02">글쓰기</a></li><?php } ?>
</ul>
<?php } ?>
</div>
<?php } ?>
</form>
<!-- 페이지 -->
<?php //echo $write_pages; ?>
</div>
<script type="text/javascript">
var num = 0;
jQuery(document).ready(function(){
jQuery(".history_img");
jQuery(".history_txt");
$(".history_icon");
})
jQuery(window).load(function(){
jQuery(".history_img").each(function(index){
jQuery.easing.def = "easeOutQuart";
num++;
jQuery(".history_img").eq(index).delay().animate({opacity:100, marginTop:"0px"}, 900);
jQuery(".history_txt").eq(index).delay().animate({opacity:100, marginTop:"0px"}, 900);
$(".history_icon").eq(index).delay().animate({opacity:100, marginTop:"0px"}, 600);
})
})
</script>
<script type="text/javascript">
if ('<?=$sca?>') document.fcategory.sca.value = '<?=$sca?>';
/*
if ('<?=$stx?>') {
document.fsearch.sfl.value = '<?=$sfl?>';
if ('<?=$sop?>' == 'and')
document.fsearch.sop[0].checked = true;
if ('<?=$sop?>' == 'or')
document.fsearch.sop[1].checked = true;
} else {
document.fsearch.sop[0].checked = true;
}
*/
</script>
<?php if ($is_checkbox) { ?>
<script>
function all_checked(sw) {
var f = document.fboardlist;
for (var i=0; i<f.length; i++) {
if (f.elements[i].name == "chk_wr_id[]")
f.elements[i].checked = sw;
}
}
function fboardlist_submit(f) {
var chk_count = 0;
for (var i=0; i<f.length; i++) {
if (f.elements[i].name == "chk_wr_id[]" && f.elements[i].checked)
chk_count++;
}
if (!chk_count) {
alert(document.pressed + "할 게시물을 하나 이상 선택하세요.");
return false;
}
if(document.pressed == "선택복사") {
select_copy("copy");
return;
}
if(document.pressed == "선택이동") {
select_copy("move");
return;
}
if(document.pressed == "선택삭제") {
if (!confirm("선택한 게시물을 정말 삭제하시겠습니까?\n\n한번 삭제한 자료는 복구할 수 없습니다"))
return false;
}
return true;
}
// 선택한 게시물 복사 및 이동
function select_copy(sw) {
var f = document.fboardlist;
if (sw == "copy")
str = "복사";
else
str = "이동";
var sub_win = window.open("", "move", "left=50, top=50, width=500, height=550, scrollbars=1");
f.sw.value = sw;
f.target = "move";
f.action = "./move.php";
f.submit();
}
</script>
<?php } ?>
<!-- } 게시판 목록 끝 -->
<script type="text/javascript" src="<?php echo $board_skin_url ?>/js/lightbox-2.6.min.js"></script>
답변 1
.history_img{width:200px;position:relative;float:left;margin-right:50px;padding-left:10px;text-align:center;min-height:40px;}
여기에서 margin-right 값을 더 늘리면 될것 같습니다~
고맙습니다!!
고맙습니다!!
답변을 작성하시기 전에 로그인 해주세요.
