Heim > Artikel > Web-Frontend > IE6下span右浮动换行怎么处理_html/css_WEB-ITnose
IE6下span右浮动换行怎么处理_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 11:41:451075Durchsuche
IE6下span右浮动换行怎么处理:
在编写新闻列表的时候，一般要求左边是新闻标题，右边是新闻发布时间。时间一般会放在标签中，并将其右浮动。
代码如下:
<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.51texiao.cn/" /><title>蚂蚁部落</title><style type="text/css">li{ list-style-type:none; font-size:12px; color:blue; width:300px; height:30px; line-height:30px; border-bottom:1px dashed blue;}span{ color:red; width:60px; height:30px; float:right;}</style></head><body><div> <ul> <li><a href="#">蚂蚁部落欢迎您</a><span>2012-12-13</span></li> <li><a href="#">大家好，好久不见了</a><span>2012-12-13</span></li> <li><a href="#">蚂蚁部落</a><span>2012-12-13</span></li> </ul></div></body></html> 以上代码在IE8或者FF浏览器中是正常的，但是在IE6浏览器中时间却换行了。
解决方案:将标签和标签分别浮动起来，分别左右浮动即可。代码如下:
<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.51texiao.cn/" /><title>蚂蚁部落</title><style type="text/css">li{ list-style-type:none; font-size:12px; color:blue; width:300px; height:30px; line-height:30px; border-bottom:1px dashed blue;}a{ width:240px; height:30px; float:left;}span{ color:red; width:60px; height:30px; float:right;}</style></head><body><div> <ul> <li><a href="#">蚂蚁部落欢迎您</a><span>2012-12-13</span></li> <li><a href="#">大家好，好久不见了</a><span>2012-12-13</span></li> <li><a href="#">蚂蚁部落</a><span>2012-12-13</span></li> </ul></div></body></html> 原文地址:http://www.51texiao.cn/div_cssjiaocheng/2015/0429/419.html
Stellungnahme：
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
Vorheriger Artikel：雷达图_html/css_WEB-ITnoseNächster Artikel：CSS：你未必知道的@规则_html/css_WEB-ITnose