软件下载 | 资讯教程 | 最近更新 | 下载排行 | 一键转帖 | 发布投稿
您的位置:最火下载站 > Web前端 > 工具与技巧 > 分享几条漂亮的下划线样式

分享几条漂亮的下划线样式

早上看到一篇博客,内容没什么,但其中有几条漂亮的下划线感觉非常不错,虽然非常简单,但对于经常写博的人很有用,这里分享一下,喜欢的就直接拿去用吧。

使用方法:

1.后台管理->设置:[页首Html代码]里面加上下面的CSS:

Copy to ClipboardLiehuo.Net Codes引用的内容:[www.veryhuo.com]
.postbody .underline1 {
background:transparent url('http://pic.veryhuo.com/allimg/0912/o_underline_1.gif') repeat-x scroll 120% 100%;
padding:0 3px 3px;
text-decoration:none;
}
.postbody .underline2 {
background:transparent url('http://pic.veryhuo.com/allimg/0912/o_underline_2.gif') repeat-x scroll 120% 100%;
padding:0 3px 3px;
text-decoration:none;
}
.postbody .underline3 {
background:transparent url('http://pic.veryhuo.com/allimg/0912/o_underline_3.gif') repeat-x scroll 120% 100%;
padding:0 3px 3px;
text-decoration:none;
}
.postbody .underline4 {
background:transparent url('http://pic.veryhuo.com/allimg/0912/o_underline_4.gif') repeat-x scroll 120% 100%;
padding:0 3px 3px;
text-decoration:none;
}
.postbody .underline5 {
background:transparent url('http://pic.veryhuo.com/allimg/0912/o_underline_5.gif') repeat-x scroll 120% 100%;
padding:0 3px 3px;
text-decoration:none;
}
.postbody .underline6 {
background:transparent url('http://pic.veryhuo.com/allimg/0912/o_underline_6.gif') repeat-x scroll 120% 100%;
padding:0 3px 3px;
text-decoration:none;
}
.postbody .underline7 {
background:transparent url('http://pic.veryhuo.com/allimg/0912/o_underline_7.gif') repeat-x scroll 120% 100%;
padding:0 3px 3px;
text-decoration:none;
}
.postbody .underline8 {
background:transparent url('http://pic.veryhuo.com/allimg/0912/o_underline_8.gif') repeat-x scroll 120% 100%;
padding:0 3px 3px;
text-decoration:none;
}
.postbody .underline9 {
background:transparent url('http://pic.veryhuo.com/allimg/0912/o_underline_9.gif') repeat-x scroll 120% 100%;
padding:0 3px 3px;
text-decoration:none;
}

2.在正文中使用类似如下的写法,将需要用下划线标注的文字包在特定的cass="underline数字"的标签里:

<P>underline1:<SPAN class=underline1>从前有座山,山里有个老和尚...</SPAN></P>

    相关阅读
    网友评论
    栏目导航
    推荐软件