Maison > interface Web > tutoriel HTML > li 项目符号_html/css_WEB-ITnose

li 项目符号_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Libérer: 2016-06-21 09:35:52
original
1112 Les gens l'ont consulté

<!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>
Copier après la connexion


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

------------------------------------------------------------------------------
如果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>
Copier après la connexion

试试

HTML code

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



位置相反总觉得怪怪的,不过也简单解决了。。。
Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal