订阅
可能吧优秀排版风格转载测试

可能吧优秀排版风格转载测试

转播到腾讯微博 分享到QQ空间 分享到腾讯朋友

在五毛的博客发现这种排版方式,实在是非常喜欢,赶紧转过来了,并且马上对主题进行改造,现在也能用上这种风格了,灰常灰常开心哇!!

 


可能吧的排版主要由如下两部分构成:

标题栏(也就是我们通常所谓的绿条)

引用(也就是通常所谓的灰边)


我们怎么做才能有“绿”条?


主题样式表Style.css合适部位添加:

#main .post .content h1{
padding:3px 6px 3px 6px;
background:#9c0;
font-family:微软雅黑;
font-size:16px;color:#000;
}


background:#9c0; (标题栏背景颜色代码)

font-family:微软雅黑; (标题栏字体)

font-size:16px;(标题栏字体大小);color:#000;(字体颜色)


其次,我们要怎么做才能有灰边?


同样在主题样式表Style.css中将:
blockquote, pre{ ****}

替换为下面的代码

blockquote, pre {
background:#cce8cf;
border-width: 0 0 0 5px;
border-style: solid;
border-color: #DEDCD4;
padding:8px 12px 8px 12px;
margin:5px 0 5px 20px;

}


其中background:#cce8cf; (引用框背景色,如果无需背景色直接删除即可)

最后,写文章的时候如何才能调用上述效果?


绿条(后台编辑可视化模式下,“格式”选择Heading 1,WLW写博的直接调用<h1> </h1>即可)

灰边(直接引用所需内容)

已有 4 条看法 »

  1. 这个效果不错的

  2. 闲推月下门 闲推月下门

    @自由人
    谢谢,就是喜欢这排版风格效果,所以才把博客改成这样的风格

  3. padding直接写缩写就好了 3px 6px

  4. 支持了。。。。

添加新看法 »

快速发布看法请使用[ Ctrl + Enter ],垃圾评论请免,绝对会删除的!

无觅相关文章插件,快速提升流量