li 项目符号_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-21 09:35:52
Original
1072 Leute haben es durchsucht

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><style type="text/css">ul,li{margin:0; padding:0;  }ul{border:solid 1px red; padding:5px; width:300px;}li{ line-height:25px;list-style:inside decimal; clear:both;}li a{float:left; font-size:14px;}li span{float:right; color:#999999}</style></head><body><ul>    <li> <a href="#">新闻标题1</a><span>06/04/2012</span></li>    <li> <a href="#">新闻标题1</a><span>06/04/2012</span></li>    <li> <a href="#">新闻标题1</a><span>06/04/2012</span></li>    <li> <a href="#">新闻标题1</a><span>06/04/2012</span></li></ul></div></body></html>
Nach dem Login kopieren


上面设置左右浮动显示,但是项目符号显示位置不对

------------------------------------------------------------------------------
如果css 改为

ul,li{margin:0; padding:0; }
ul{border:solid 1px red; padding:5px; width:300px;}
li{ line-height:25px;list-style:inside decimal; clear:both;}
li a{ font-size:14px;}/*这里不设置float:left*/
li span{float:right; color:#999999}


但是ie6 时间显示位置不对(换行了),不知道如何清除浮动。。。


如何解决上述问题??


回复讨论(解决方案)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><style type="text/css">ul,li{margin:0; padding:0; }ul{border:solid 1px red; padding:5px; width:300px;clear:both;}li{ line-height:25px;list-style:inside decimal; }li a{ font-size:14px;}/*这里不设置float:left*/li span{float:right; color:#999999}</style></head><body><div><ul>    <li> <span>06/04/2012</span><a href="#">新闻标题1</a></li>    <li> <span>06/04/2012</span><a href="#">新闻标题1</a></li>    <li> <span>06/04/2012</span><a href="#">新闻标题1</a></li>    <li> <span>06/04/2012</span><a href="#">新闻标题1</a></li></ul></div></body></html>
Nach dem Login kopieren

试试

HTML code

nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



位置相反总觉得怪怪的,不过也简单解决了。。。
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage