思章老师

When your legs get tired, run with your heart.

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

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

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

    2010.06.04

    WordPress 3.0 RC2 发布

    小百度每都在跟进WordPress官方的更新…

  2. 没有图片

    2010.08.22

    去掉 WordPress 默认主题中官方 wordpress.org 链接

    一般安装WordPress之后,在小工具的M…

  3. 2017.06.02

    让热爱运动从小扎根孩子们的心灵

    今天是六一儿童节,首先祝孩子们节日快乐,也祝…

  4. 没有图片

    2013.05.23

    Centos yum 安装 xcache 教程

    Xcache是一个开源的操作码缓存器/优化器…

  5. 没有图片

    2010.06.10

    Adobe Dreamweaver CS5 新增功能

    Adobe CS5系列软件于2010年4月发…

  6. 没有图片

    2010.05.07

    中国人的两个极端:自卑与自傲

    我们民族没有包容性的性格,如此造成中国人两个…

评论

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

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

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

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

返回首页

avatar
客服小美
Powered by   萌芽科技

© 2009 思章老师Themed by WP盒子

返回顶部