HTML中Li标签的使用示例

ttx9n · 发表于 2015-7-13 16:38:04

这篇文章主要介绍了HTML中Li标签的使用示例,主要用来让文章标题和日期等左右对齐,需要的朋友可以参考下

希望实现标题在左对齐，日期在右对齐，当直接给日期的span加上float:right时，IE8和FF都OK，但IE6/7则会换行，下面给出一个简单有效的解决办法。

XML/HTML Code复制内容到剪贴板

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style>
<!--
#mylist { width:400px; list-style-type:none; margin:0; padding:0; }
#mylist li span {
float:right;
}
-->
</style>
</head>
<body>
<ul id="mylist">
<li><span>2011-12-2</span>Web开发者网络（Admin10000.com）</li>
<li><span>2011-12-2</span>Web开发者网络（Admin10000.com）</li>
<li><span>2011-12-2</span>Web开发者网络（Admin10000.com）</li>
</ul>
</body>
</html>

注意: 要把 span 写到Li标签中的最前面，这样在IE6/IE7/FF3.5之前版本中才能保证 span中日期右对齐。

do827261756 · 发表于 2022-11-27 17:13:32

554411515451555

0vwrdf6 · 发表于 2022-12-18 03:48:29

非常vbcbvcvbvcb

ppwxcg · 发表于 2023-1-9 20:02:53

hi哦回复iOS就看见

w18pvaep · 发表于 2023-1-22 10:01:16

我找了挺久终于找到了

6q8s6p21 · 发表于 2023-3-2 15:35:51

需要很久了终于找到了

sykzus · 发表于 2023-8-31 14:11:56

了乐趣了去了去了去了去了

wangdj110 · 发表于 2023-10-15 16:59:19

的vgdsvsdvdsvdsvds

0608fv3 · 发表于 2024-4-18 23:16:40

谢谢下载来看看

nwk53kbd · 发表于 2024-5-19 12:10:50

额UI废物iuhfujewfiewnnfen

账号		自动登录	找回密码
密码			立即注册

[HTML/Xhtml] HTML中Li标签的使用示例