모바일최신글 목록에 글번호 나오게 하려고하는데요....
본문
------latest.skin.php-----------
<?php
if (!defined('_GNUBOARD_')) {
exit;
} // 개별 페이지 접근 불가
// add_stylesheet('css 구문', 출력순서); 숫자가 작을 수록 먼저 출력됨
add_stylesheet('<link rel="stylesheet" href="' . $latest_skin_url . '/style.css?v=new1">', 0);
add_stylesheet('<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">', 0);
add_stylesheet('<link rel="stylesheet" href="http://fonts.googleapis.com/earlyaccess/nanumgothic.css">', 0);
?>
<div class="ask_latest">
<h3 class="add_gradient">
<a href="<?php echo G5_BBS_URL ?>/board.php?bo_table=<?php echo $bo_table ?>"><?php echo $bo_subject; ?></a>
<div class="more_view"><a href="<?php echo G5_BBS_URL ?>/board.php?bo_table=<?php echo $bo_table ?>" class="button">more</a></div>
</h3>
<ul class="ask_latest_list">
<?php
$write_table = $g5['write_prefix'].$bo_table;
$sql = " select distinct wr_parent from $write_table ";
$result = sql_query($sql);
$total_count = mysql_num_rows($result);
for ($i=0; $i<count($list); $i++) {
$list_num = $total_count;
$list[$i]['num'] = $list_num - $k;
$k++;
?>
<li class="al_item">
<?php echo $list[$i]['num'] ?>
<?php
//echo $list[$i]['icon_reply']." ";
echo "<a href=\"" . $list[$i]['href'] . "\">";
if ($list[$i]['is_notice']) {
echo "<strong>" . $list[$i]['subject'] . "</strong>";
} else {
echo $list[$i]['subject'];
}
if ($list[$i]['comment_cnt']) {
echo "<span class='ask_comment_count'>(" . $list[$i]['comment_cnt'] . ")</span>";
}
/* 날짜 */
echo "<div class='ask_item_datetime'>" . date("m.d", strtotime($list[$i]['wr_datetime'])) . "</div>";
if (isset($list[$i]['icon_new'])) echo " " . $list[$i]['icon_new'];
if (isset($list[$i]['icon_hot'])) echo " " . $list[$i]['icon_hot'];
if (isset($list[$i]['icon_file'])) echo " " . $list[$i]['icon_file'];
if (isset($list[$i]['icon_link'])) echo " " . $list[$i]['icon_link'];
if (isset($list[$i]['icon_secret'])) echo " " . $list[$i]['icon_secret'];
echo "</a>";
?>
</li>
<?php } ?>
<?php if (count($list) == 0) { //게시물이 없을 때 ?>
<li>게시물이 없습니다.</li>
<?php } ?>
</ul>
</div>
<!-- } <?php echo $bo_subject; ?> 최신글 끝 -->
노란색부분을
알려주신대로 적용했는데...
위에 사진과 같이 글번호가 위에 나오고 제목이밑에 나오는데....
글번호다음에 제목이 옆으로 나오게하려면 어떡해해야하는지 알려주시면 감사하겠습니다....
-----------------style.css ------------------
@charset "utf-8";
/* ask latest 모바일용 */
.ask_latest{
font-family: 'Namum Gothic', '맑은고딕', 'Malgnu Gothic';line-height: 200%;;
}
.ask_latest a{
text-decoration: none; display: block;
}
.ask_latest h3{
font-size: 1.1em; display: block; padding: 5px 0 5px 15px; border:1px solid #ccc; font-weight: normal; position: relative;
}
.ask_latest_list{
display: block; padding: 0; margin: 0; overflow: hidden; border: 1px solid #ccc; border-top: none; padding: 10px 15px; list-style: none; min-height: 130px;
}
.ask_latest_list a{
border-bottom: 1px dashed #efefef;
}
.ask_latest_list li:last-child a{
border:none;
}
.al_item{
display: block; position: relative;
}
.ask_item_datetime{
position: absolute; top:2px; right: 0; font-size: .9em; color: #666;
}
.ask_date{
position: absolute; top:2px; left: 0; font-size: .9em; color: #666;
}
.ask_comment_count{
font-size: .9em; color: #993300
}
.more_view{
position: absolute; right: 5px; top: 7px;
}
.more_view .button{
padding: .25em .5em;
}
i.fa{
color: #666; letter-spacing: 1px;
}
.add_gradient{
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(241,241,241,1) 50%, rgba(225,225,225,1) 51%, rgba(246,246,246,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 ); /* IE6-9 */
}
/* 스마트폰 (가로 및 세로) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
/* 사용자 코드 */
.more_view{
top: 3px;
}
.more_view .button{
padding: .05rem .25rem;
}
}
/* 스마트폰 (가로 ) ----------- */
@media only screen and (min-width : 321px) {
/* 사용자 코드 */
}
/* 스마트폰 (세로) ----------- */
@media only screen and (max-width : 320px) {
/* 사용자 코드 */
}
/* 아이패드 (가로 및 세로) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
/* 사용자 코드 */
}
/* 아이패드 (가로) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
/* 사용자 코드 */
}
/* 아이패드 (세로) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
/* 사용자 코드 */
}
/* PC 및 노트북 ----------- */
@media only screen and (min-width : 1224px) {
/* 사용자 코드 */
}
/* 대형 스크린 ----------- */
@media only screen and (min-width : 1824px) {
/* 사용자 코드 */
}
/* 아이폰 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* 사용자 코드 */
}
/* 아이폰 5 & 5S 가로 및 세로 */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) {
/* 사용자 코드 */
}
/* 아이폰 5 & 5S 가로 ------ */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape) {
/* 사용자 코드 */
}
/* 아이폰 5 & 5S 세로 ------ */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : portrait) {
/* 사용자 코드 */
}
/* 아이폰 6 세로 및 가로 */
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) {
/* 사용자 코드 */
}
/* 아이폰 6 가로 */
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : landscape) {
/* 사용자 코드 */
}
/* 아이폰 6 세로 */
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : portrait) {
/* 사용자 코드 */
}
/* 아이폰 6 Plus 가로 및 세로 */
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) {
/* 사용자 코드 */
}
/* 아이폰 6 Plus 가로 */
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : landscape) {
/* 사용자 코드 */
}
/* 아이폰 6 Plus 세로 */
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : portrait) {
/* 사용자 코드 */
}
/* 아이패드 미니 가로 및 세로 */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 1) {
/* 사용자 코드 */
}
/* 아이패드 미니 가로 */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio: 1) {
/* 사용자 코드 */
}
/* 아이패드 미니 세로 */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 1) {
/* 사용자 코드 */
}
/*버튼*/
.button{position:relative;overflow:visible;display:inline-block;padding:.5em 1em;border:1px solid #d4d4d4;margin:0;text-decoration:none;text-align:center;text-shadow:1px 1px 0 #fff;font:11px/normal sans-serif;color:#333;white-space:nowrap;cursor:pointer;outline:none;background-color:#ececec;background-image:-webkit-gradient(linear,0 0,0 100%,from(#f4f4f4),to(#ececec));background-image:-moz-linear-gradient(#f4f4f4,#ececec);background-image:-ms-linear-gradient(#f4f4f4,#ececec);background-image:-o-linear-gradient(#f4f4f4,#ececec);background-image:linear-gradient(#f4f4f4,#ececec);-moz-background-clip:padding;background-clip:padding-box;border-radius:.2em;zoom:1;*display:inline}.button:hover,.button:focus,.button:active,.button.active{border-color:#3072b3;border-bottom-color:#2a65a0;text-decoration:none;text-shadow:-1px -1px 0 rgba(0,0,0,0.3);color:#fff;background-color:#3c8dde;background-image:-webkit-gradient(linear,0 0,0 100%,from(#599bdc),to(#3072b3));background-image:-moz-linear-gradient(#599bdc,#3072b3);background-image:-o-linear-gradient(#599bdc,#3072b3);background-image:linear-gradient(#599bdc,#3072b3)}.button:active,.button.active{border-color:#2a65a0;border-bottom-color:#3884cd;background-color:#3072b3;background-image:-webkit-gradient(linear,0 0,0 100%,from(#3072b3),to(#599bdc));background-image:-moz-linear-gradient(#3072b3,#599bdc);background-image:-ms-linear-gradient(#3072b3,#599bdc);background-image:-o-linear-gradient(#3072b3,#599bdc);background-image:linear-gradient(#3072b3,#599bdc)}.button::-moz-focus-inner{padding:0;border:0}.button.icon:before{content:"";position:relative;top:1px;float:left;width:12px;height:12px;margin:0 .75em 0 -.25em;background:url(gh-icons.png) 0 99px no-repeat}.button.arrowup.icon:before{background-position:0 0}.button.arrowup.icon:hover:before,.button.arrowup.icon:focus:before,.button.arrowup.icon:active:before{background-position:-12px 0}.button.arrowdown.icon:before{background-position:0 -12px}.button.arrowdown.icon:hover:before,.button.arrowdown.icon:focus:before,.button.arrowdown.icon:active:before{background-position:-12px -12px}.button.arrowleft.icon:before{background-position:0 -24px}.button.arrowleft.icon:hover:before,.button.arrowleft.icon:focus:before,.button.arrowleft.icon:active:before{background-position:-12px -24px}.button.arrowright.icon:before{float:right;margin:0 -.25em 0 .5em;background-position:0 -36px}.button.arrowright.icon:hover:before,.button.arrowright.icon:focus:before,.button.arrowright.icon:active:before{background-position:-12px -36px}.button.approve.icon:before{background-position:0 -48px}.button.approve.icon:hover:before,.button.approve.icon:focus:before,.button.approve.icon:active:before{background-position:-12px -48px}.button.add.icon:before{background-position:0 -288px}.button.add.icon:hover:before,.button.add.icon:focus:before,.button.add.icon:active:before{background-position:-12px -288px}.button.remove.icon:before{background-position:0 -60px}.button.remove.icon:hover:before,.button.remove.icon:focus:before,.button.remove.icon:active:before{background-position:-12px -60px}.button.log.icon:before{background-position:0 -72px}.button.log.icon:hover:before,.button.log.icon:focus:before,.button.log.icon:active:before{background-position:-12px -72px}.button.calendar.icon:before{background-position:0 -84px}.button.calendar.icon:hover:before,.button.calendar.icon:focus:before,.button.calendar.icon:active:before{background-position:-12px -84px}.button.chat.icon:before{background-position:0 -96px}.button.chat.icon:hover:before,.button.chat.icon:focus:before,.button.chat.icon:active:before{background-position:-12px -96px}.button.clock.icon:before{background-position:0 -108px}.button.clock.icon:hover:before,.button.clock.icon:focus:before,.button.clock.icon:active:before{background-position:-12px -108px}.button.settings.icon:before{background-position:0 -120px}.button.settings.icon:hover:before,.button.settings.icon:focus:before,.button.settings.icon:active:before{background-position:-12px -120px}.button.comment.icon:before{background-position:0 -132px}.button.comment.icon:hover:before,.button.comment.icon:focus:before,.button.comment.icon:active:before{background-position:-12px -132px}.button.fork.icon:before{background-position:0 -144px}.button.fork.icon:hover:before,.button.fork.icon:focus:before,.button.fork.icon:active:before{background-position:-12px -144px}.button.like.icon:before{background-position:0 -156px}.button.like.icon:hover:before,.button.like.icon:focus:before,.button.like.icon:active:before{background-position:-12px -156px}.button.favorite.icon:before{background-position:0 -348px}.button.favorite.icon:hover:before,.button.favorite.icon:focus:before,.button.favorite.icon:active:before{background-position:-12px -348px}.button.home.icon:before{background-position:0 -168px}.button.home.icon:hover:before,.button.home.icon:focus:before,.button.home.icon:active:before{background-position:-12px -168px}.button.key.icon:before{background-position:0 -180px}.button.key.icon:hover:before,.button.key.icon:focus:before,.button.key.icon:active:before{background-position:-12px -180px}.button.lock.icon:before{background-position:0 -192px}.button.lock.icon:hover:before,.button.lock.icon:focus:before,.button.lock.icon:active:before{background-position:-12px -192px}.button.unlock.icon:before{background-position:0 -204px}.button.unlock.icon:hover:before,.button.unlock.icon:focus:before,.button.unlock.icon:active:before{background-position:-12px -204px}.button.loop.icon:before{background-position:0 -216px}.button.loop.icon:hover:before,.button.loop.icon:focus:before,.button.loop.icon:active:before{background-position:-12px -216px}.button.search.icon:before{background-position:0 -228px}.button.search.icon:hover:before,.button.search.icon:focus:before,.button.search.icon:active:before{background-position:-12px -228px}.button.mail.icon:before{background-position:0 -240px}.button.mail.icon:hover:before,.button.mail.icon:focus:before,.button.mail.icon:active:before{background-position:-12px -240px}.button.move.icon:before{background-position:0 -252px}.button.move.icon:hover:before,.button.move.icon:focus:before,.button.move.icon:active:before{background-position:-12px -252px}.button.edit.icon:before{background-position:0 -264px}.button.edit.icon:hover:before,.button.edit.icon:focus:before,.button.edit.icon:active:before{background-position:-12px -264px}.button.pin.icon:before{background-position:0 -276px}.button.pin.icon:hover:before,.button.pin.icon:focus:before,.button.pin.icon:active:before{background-position:-12px -276px}.button.reload.icon:before{background-position:0 -300px}.button.reload.icon:hover:before,.button.reload.icon:focus:before,.button.reload.icon:active:before{background-position:-12px -300px}.button.rss.icon:before{background-position:0 -312px}.button.rss.icon:hover:before,.button.rss.icon:focus:before,.button.rss.icon:active:before{background-position:-12px -312px}.button.tag.icon:before{background-position:0 -324px}.button.tag.icon:hover:before,.button.tag.icon:focus:before,.button.tag.icon:active:before{background-position:-12px -324px}.button.trash.icon:before{background-position:0 -336px}.button.trash.icon:hover:before,.button.trash.icon:focus:before,.button.trash.icon:active:before{background-position:-12px -336px}.button.user.icon:before{background-position:0 -360px}.button.user.icon:hover:before,.button.user.icon:focus:before,.button.user.icon:active:before{background-position:-12px -360px}.button.primary{font-weight:700}.button.danger{color:#900}.button.danger:hover,.button.danger:focus,.button.danger:active{border-color:#b53f3a;border-bottom-color:#a0302a;color:#fff;background-color:#dc5f59;background-image:-webkit-gradient(linear,0 0,0 100%,from(#dc5f59),to(#b33630));background-image:-moz-linear-gradient(#dc5f59,#b33630);background-image:-ms-linear-gradient(#dc5f59,#b33630);background-image:-o-linear-gradient(#dc5f59,#b33630);background-image:linear-gradient(#dc5f59,#b33630)}.button.danger:active,.button.danger.active{border-color:#a0302a;border-bottom-color:#bf4843;background-color:#b33630;background-image:-webkit-gradient(linear,0 0,0 100%,from(#b33630),to(#dc5f59));background-image:-moz-linear-gradient(#b33630,#dc5f59);background-image:-ms-linear-gradient(#b33630,#dc5f59);background-image:-o-linear-gradient(#b33630,#dc5f59);background-image:linear-gradient(#b33630,#dc5f59)}.button.pill{border-radius:50em}.button.disable{opacity:.5}.button.big{font-size:14px}.button.big.icon:before{top:0}.button-group{display:inline-block;list-style:none;padding:0;margin:0;zoom:1;*display:inline}.button + .button,.button + .button-group,.button-group + .button,.button-group + .button-group{margin-left:15px}.button-group li{float:left;padding:0;margin:0}.button-group .button{float:left;margin-left:-1px}.button-group > .button:not(:first-child):not(:last-child),.button-group li:not(:first-child):not(:last-child) .button{border-radius:0}.button-group > .button:first-child,.button-group li:first-child .button{margin-left:0;border-top-right-radius:0;border-bottom-right-radius:0}.button-group > .button:last-child,.button-group li:last-child > .button{border-top-left-radius:0;border-bottom-left-radius:0}.button-group.minor-group .button{border:1px solid #d4d4d4;text-shadow:none;background-image:none;background-color:#fff}.button-group.minor-group .button:hover,.button-group.minor-group .button:focus{background-color:#599bdc}.button-group.minor-group .button:active,.button-group.minor-group .button.active{background-color:#3072b3}.button-group.minor-group .button.icon:before{opacity:.8}.button-container .button,.button-container .button-group{vertical-align:top}
