思章老师

When your legs get tired, run with your heart.

  • 学学技术
  • 资源分享
  • 引领视觉
  • 个人杂烩
    • 必应壁纸
    • 我的马拉松
    • 马拉松训练
    • 我爱我家
    • 生活百态
  • 关于我们
菜单
  1. 首页
  2. 个人杂烩
  3. 给WordPress日志图片添加默认边框样式

给WordPress日志图片添加默认边框样式

2010/05 22
  • 9253 次点击
  • 个人杂烩
  • 4 条评论

很多WordPress的日志内容里或多或少地会添加一些图片,但不是所有的WordPress日志图片都带样式,本文就教大家如何简单实现WordPress日志图片添加边框样式。

以35款不同风格的RSS图标下载为例,文章里有很多图片,但所有的图片都是原生态的,没什么修饰,看起来有点呆板,如果在内容页面里添加上默认的样式表,让图片自带上边框,效果一定会不错。

首先,我们要先确认在哪里定义图片的CSS样式,本文讲的是对日志内容里的图片进行修饰,那图片的CSS样式肯定要放在内容样式下了,看图:

http://www.xbaidu.net/pic/images/2010052212.gif

我们在博客里随便找到一篇日志,之后选中日志内容的开头查看源码,千百度的内容开始源码如下:

到这里,我们就可以确定图片样式应该放在postcontent样式表里面了,于是去后台的主题编辑,编辑style.css,CTL+F,找到“postcontent”,之后在其下添加代码:

div.postcontent img { padding:3px 3px; border:#CCCCCC solid thin; }
div.postcontent img a { padding:3px 3px; border:#CCCCCC solid thin; }
div.postcontent img a:hover { padding:3px 3px; border:#FF0000 solid thin; }

这三行代码,就可以实现不带链接、带链接、鼠标放在链接上之后的效果,这里没定义图片大小,还可以添加上图片限制大小,在以后的教程中,我还会为大家献上。

思章老师

认准了方向,就要勇敢地走下去,十年磨一剑,我相信,只要坚持,一切都有可能。

相关日志

  1. 没有图片

    2012.12.27

    WordPress图床同步插件:WP MultiTarget Uploads Sync Tool

    WP-MultiTarget-Uploads…

  2. 没有图片

    2011.11.20

    新浪微博: – 2011-11-20

    #SAE应用推荐# 我发现 Wordpres…

  3. 没有图片

    2011.01.24

    WordPress 3.1 RC3 发布

    WordPress 近来更新的动作不小,从R…

  4. 没有图片

    2011.03.29

    两会人大代表建议案:交税该用支付宝

    「 建议案 」 我一个还没当上人大代表的哥们…

  5. 没有图片

    2010.05.07

    强拆

    在二战的时候,一个钉子户不搬,导致军用机场没…

  6. 没有图片

    2010.06.16

    10个Web2.0配色方案网站

    这10个网站有的可以在线配色,有的是提供一些…

评论

  • 1 评论
  1. G字头老大 2011.05.06 9:02下午

    请问如果想实现“相片堆叠”样式的图片边框效果,可以吗?

    回复
« 上一页 1 2
点击这里取消回复。

一组超炫丽的电脑桌面主题 Photo Story Platinum v3.5.0.12 绿色便携版 | 照片故事白金版

返回首页

avatar
客服小美
Powered by   萌芽科技

© 2009 思章老师Themed by WP盒子

返回顶部