正在加载中

教你如何制作个性化的标题栏

转自玩转百度空间http://hi.baidu.com/space163
效果演示地址: http://hi.baidu.com/1077

演示图片:

编辑CSS自定义模板,

找到#m_blog div.tit 行,你会看到有三个#m_blog div.tit 行,

把前两个分别替换为

#m_blog div.tit{color:#8A3506;font-size:14px;font-weight:bold;background:url(http://rssimg.mail.qq.com/readpic?url=http://hiphotos.baidu.com/space163/pic/item/accc3dc75b69dddcd100603c.jpg) no-repeat top left;text-indent: 22px;height:70px;line-height:75px}

#m_blog div.tit a{color:#8A3506;font-size:14px;font-weight:bold;background:url(http://rssimg.mail.qq.com/readpic?url=http://hiphotos.baidu.com/space163/pic/item/accc3dc75b69dddcd100603c.jpg) no-repeat top left;text-indent: 22px;height:70px;line-height:75px}

其中http://rssimg.mail.qq.com/readpic?url=http://hiphotos.baidu.com/space163/pic/item/accc3dc75b69dddcd100603c.jpg 是你需要的标题背景,改成你想要的图片地址就好了。

text-indent: 22px是标题左边缩进值
height:70px 是背景所占用的高度,根据你的背景图片的高度设置
line-height:75px是上面空的高度

点击进入标题栏背景图片素材库

点击这里返回百度空间CSS制作目录


20 Responses to “教你如何制作个性化的标题栏”

  1. 很想拥有 说:

    呵呵,支持一下!空了我那http://hi.baidu.com/cfdwb 也坐坐去啊!!!

  2. 怎么把那 说:

    你是个电脑高手吗?那可以向你请教吗?

  3. 哇晒∧∧,你好棒ò!

  4. 你真的很棒….
    你做一个CSS送给我吧…?背景闪亮亮的吧…!
    呵呵~~开玩笑
    赞….

  5. qingzi1985 说:

    奇怪,我弄了几次都弄不好。是按你说的方法做的呀。

  6. qingzi1985 说:

    成功了,谢了。

  7. wbq122 说:

    我靠 我都想拜你为师拉.强

  8. 金汁玉叶 说:

    多谢博主!!! 欢迎来我的空间作客! 保证不虚此行!!!

    http://hi.baidu.com/jzyy_2007

    http://hi.baidu.com/jzyy_2007

  9. 张恨玉 说:

    在什么地方编辑CSS自定义模板呢?
    我怎么找不到啊?
    哪位大哥教教我啊?

Post a Comment