用UL做带不同图片的导航

renye0907 2009-12-30 11:43:15
-用UL LI做导航条 文字前面有图片后面也有图片 怎么做啊
...全文
108 7 打赏 收藏 转发到动态 举报
写回复
用AI写文章
7 条回复
切换为时间正序
请发表友善的回复…
发表回复
xun_wind 2010-01-01
  • 打赏
  • 举报
回复
学习中…
hookee 2009-12-31
  • 打赏
  • 举报
回复

<style>
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}
#nav li{float:left;width:100px}
#nav li img{float:left;}
#nav li a{float:left;}
</style>
<ul id="nav">
<li><img src="http://maps.gstatic.cn/intl/zh-CN_cn/mapfiles/iw_minus.gif"><a href="">测试</a><img src="http://images.google.cn/intl/zh-CN_cn/images/cn_icp.gif"></li>
<li><img src="http://maps.gstatic.cn/intl/zh-CN_cn/mapfiles/iw_minus.gif"><a href="">测试</a><img src="http://images.google.cn/intl/zh-CN_cn/images/cn_icp.gif"></li>
<li><img src="http://maps.gstatic.cn/intl/zh-CN_cn/mapfiles/iw_minus.gif"><a href="">测试</a><img src="http://images.google.cn/intl/zh-CN_cn/images/cn_icp.gif"></li>
<li><img src="http://maps.gstatic.cn/intl/zh-CN_cn/mapfiles/iw_minus.gif"><a href="">测试</a><img src="http://images.google.cn/intl/zh-CN_cn/images/cn_icp.gif"></li>
</ul>
jwzdhxn 2009-12-31
  • 打赏
  • 举报
回复
学习学习!
lzz624 2009-12-31
  • 打赏
  • 举报
回复
[Quote=引用 1 楼 hookee 的回复:]
HTML code<style>
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}
#nav li{float:left;width:100px}
#nav li img{float:left;}
#nav li a{float:left;}</style><ulid="nav"><li><imgsrc="http://maps.gstatic.cn/intl/zh-CN_cn/mapfiles/iw_minus.gif"><ahref="">测试</a><imgsrc="http://images.google.cn/intl/zh-CN_cn/images/cn_icp.gif"></li><li><imgsrc="http://maps.gstatic.cn/intl/zh-CN_cn/mapfiles/iw_minus.gif"><ahref="">测试</a><imgsrc="http://images.google.cn/intl/zh-CN_cn/images/cn_icp.gif"></li><li><imgsrc="http://maps.gstatic.cn/intl/zh-CN_cn/mapfiles/iw_minus.gif"><ahref="">测试</a><imgsrc="http://images.google.cn/intl/zh-CN_cn/images/cn_icp.gif"></li><li><imgsrc="http://maps.gstatic.cn/intl/zh-CN_cn/mapfiles/iw_minus.gif"><ahref="">测试</a><imgsrc="http://images.google.cn/intl/zh-CN_cn/images/cn_icp.gif"></li></ul>
[/Quote]

高手呀
千游 2009-12-31
  • 打赏
  • 举报
回复
[Quote=引用 1 楼 hookee 的回复:]
HTML code<style>
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}
#nav li{float:left;width:100px}
#nav li img{float:left;}
#nav li a{float:left;}</style><ulid="nav"><li><imgsrc="http://maps.gstatic.cn/intl/zh-CN_cn/mapfiles/iw_minus.gif"><ahref="">测试</a><imgsrc="http://images.google.cn/intl/zh-CN_cn/images/cn_icp.gif"></li><li><imgsrc="http://maps.gstatic.cn/intl/zh-CN_cn/mapfiles/iw_minus.gif"><ahref="">测试</a><imgsrc="http://images.google.cn/intl/zh-CN_cn/images/cn_icp.gif"></li><li><imgsrc="http://maps.gstatic.cn/intl/zh-CN_cn/mapfiles/iw_minus.gif"><ahref="">测试</a><imgsrc="http://images.google.cn/intl/zh-CN_cn/images/cn_icp.gif"></li><li><imgsrc="http://maps.gstatic.cn/intl/zh-CN_cn/mapfiles/iw_minus.gif"><ahref="">测试</a><imgsrc="http://images.google.cn/intl/zh-CN_cn/images/cn_icp.gif"></li></ul>
[/Quote]
学习下
fireman_me 2009-12-31
  • 打赏
  • 举报
回复
林昭,怎么什么都会啊
xcf007 2009-12-31
  • 打赏
  • 举报
回复
或者给li一个图片放左边,a一个图片放右边做背景图。

61,110

社区成员

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧