思章老师

When your legs get tired, run with your heart.

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

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

2010/05 22
  • 9216 次点击
  • 个人杂烩
  • 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. 没有图片

    2011.01.05

    WordPress 模版参数(一)

    <?php the_author_ni…

  2. 没有图片

    2010.05.07

    日.月.春.秋

    秦国占春秋一半,明朝开日月成双。 这是从中国…

  3. 没有图片

    2010.12.16

    自由门专业版 你找到了吗?

    今天菠萝想趴梯看墙外风景,居然找不到几个可行…

  4. 没有图片

    2010.05.15

    再谈男人与女人

    男人们聊天,七分谈理想,三分谈女人;女人们则…

  5. 没有图片

    2010.06.16

    Web2.0网页配色方案之二

    不同风格的网页配色方案,已经进行适当的分类,…

  6. 没有图片

    2013.07.21

    魅族是怎样炼成的[纯个人收藏]

    本篇日志,只是今晚看了《速度与激情6》之后无…

评论

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

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

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

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

返回首页

avatar
客服小美
Powered by   萌芽科技

© 2009 思章老师Themed by WP盒子

返回顶部