HotNews Pro主题修改前后篇文章模块


总觉得HotNew Pro这款主题在设计“上篇”、“下篇”的时候,占用空间有点大,还不如修改为一行显示呢!先上图吧!

修改前,分两行显示:

HotNew Pro主题修改

修改后,单行显示,超出部分省略掉,且代之以“…”符号:

HotNew Pro主题修改

HotNew Pro主题修改

single.php,第94行开始

[php]
<div class="context_b">
<span class="previous_post_link cut_text">
<?php previous_post_link(‘【上篇】%link’) ?>
</span>
<span class="next_post">【下篇】</span>
<span class="next_post_link cut_text">
<?php next_post_link(‘%link’) ?>
</span>
<i class="lt"></i>
<i class="rt"></i>
<i class="lb"></i>
<i class="rb"></i>
</div>
[/php]

style.css,第516行

[css]
.context_b {
position:relative;
font-size: 13px;
background:#fff;
width:710px;
height:20px;
margin: 0 0 10px 0;
padding: 10px;
line-height:23px;
border:1px solid #ccc;
}

.previous_post_link{
float: left;
}

.next_post{
float: right;
}

.next_post_link{
float: right;
text-align: right;
}

.cut_text{
display:block;
width: 300px;
overflow: hidden;
white-space:nowrap;
/*文本溢出用"…"表示*/
text-overflow:ellipsis; /*适用IE*/
-o-text-overflow:ellipsis; /*适用opera*/
-moz-binding: url(‘ellipsis.xml#ellipsis’);/*适用火狐(firefox通过XUL实现效果)*/
}

[/css]

 

4 Responses Comment (4) Trackback (0)
  1. 水漾涟漪sily :

    :sad: :sad:

  2. 水漾涟漪sily :

    :sad: :sad: :sad:

  3. 水漾涟漪sily :

    :cry: :sad: :evil: :!: 这个留言表情忒丑了! :arrow:

发表评论