修改Blockquote让引用文段模块更漂亮

作者:Matrix 被围观: 2,158 次 发布时间:2013-09-05 分类:wordpress建站 兼容并蓄 拷贝型 | 7 条评论 »

NOTICE:这是一个创建于 1185 天前的主题,其中的信息可能已经有所发展或是发生改变。

更换主题-七彩之家BLUE2.0以及后续的修改 提过修改css中Blockquote样式来让引用样式更beautiful。

样式一:

修改Blockquote让引用文段模块更漂亮 样式一

代码:

  1. Blockquote{    
  2. background#d9e9ff;    
  3. padding10px 15px 10px 15px;    
  4. margin: 1em 3em 1em 3em;    
  5. font-size:.8em;    
  6. border-style:dotted dotted dotted solid;    
  7. border-width:1px 1px 1px 5px;    
  8. border-color:#5bbcdd;    
  9. line-height:200%;    
  10. }   

样式二:

样式二

 

代码:

  1. blockquote{color:#2b2b2bbackground:url(images/patt.png) repeat;margin:10px 20px;padding:8px 16px;border:1px solid  #CCC;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;}  

背景图片patt.png可自定义。

patt.png下载:

http://link.hhtjim.com/bdwl/2952143733/3238236832/patt.png

百度网盘源地址:http://pan.baidu.com/share/link?shareid=2952143733&uk=3238236832

样式三:

样式三

代码:

  1. blockquote:before, blockquote:after, q:before, q:after { content""; }  
  2. blockquote, q { quotes"" ""; }  
  3. blockquote  { margin: 1.5em; color#666font-styleitalic; }  
  4.   
  5. blockquote{padding:0 0 0 15px;margin:0 0 18px;border-left:5px solid #eee}  
  6. blockquote{border-color:#ddd;border-color:rgba(0,0,0,0.15)}  
本文固定链接:http://www.hhtjim.com/modify-the-blockquote-quoted-passage-module-is-more-beautiful.html
Matrix
本文章由 Matrix 于2013年09月05日发布在wordpress建站, 兼容并蓄, 拷贝型分类下,目前没有通告,你可以至底部留下评论。
转载请注明:修改Blockquote让引用文段模块更漂亮-HHTjim'S 部落格
关键字:,

有7 条评论 »

  1. 望星湖畔 望星湖畔 2013-12-27 10:17:11 +0800#4

    不需要修改《pre》标签吗?

    • Matrix Matrix Moderator 2013-12-27 11:28:25 +0800

      不需要。
      引用文字段是blockquote标签
      代码段才是pre标签

  2. 望星湖畔 望星湖畔 2013-12-27 10:16:26 +0800#3

    不需要修改&ltpre>标签吗?

  3. xilouqingzhu xilouqingzhu 2013-10-2 18:34:45 +0800#2

    额,,就是给引用加上css吧

    • Matrix Matrix Moderator 2013-10-2 20:43:15 +0800

      是啊 就因为那主题太简单了,引用段样式都没有。

  4. 逗婦乳 逗婦乳 2013-9-29 17:31:19 +0800#1

    博主啊,从哪里盗来的写个源地址嘛

    • Matrix Matrix Moderator 2013-9-29 22:33:11 +0800

      额~ 忘了留地址,罪过罪过。

添加新评论 »

 😛 Sad 忧伤 👿 Smile 笑脸 😳 😀 😯 😮 😕 😎 😆 😡 😈 Roll Eyes 转眼珠 😉 💡 😐 😥 Mr Green 绿脸先生

NOTICE: You should type some Chinese word (like “你好”) in your comment to pass the spam-check, thanks for your patience!