怎么使UL不换行
- HTML code
<body>正文文本<ul><li><a>UL列表</a><div id="div_4"> <a href='javascript:'>新建</a></div></li></ul></body>
这个出来后,"UL列表"会在"正文文本"的下面一行,怎么把"UL列表"紧贴到"正文文本"后面?
[解决办法]
你干嘛非要让div出现在li标签里,本身div就是一个换行式的标签,如果你想让li标签实现水平的话,
ul{list-style-type:none;}
ul li{width:100px; height:30px; float:left;}
这样应该可以了
[解决办法]
试试这个:
display:inline;(部分浏览器不支持)
没看清楚你的具体意思,不然选别的把,总觉得让ul不换行有点怪怪的。
[解决办法]
很笼统的给你修改了一下样式,因为只知道你需要ui不换行显示,回头最好你上传个图,这样就能很清楚的帮助你怎么解决你遇到的问题了~
下面的代码你运行试试看~~~
- HTML code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>MAXX</title><style type="text/css">*{margin:0;padding:0;}.set_bor ul{ list-style-type:none; float: left;.set_bor ul li{ margin: 0; padding: 0; list-style: none;}.set_bor li a{ display: block; margin: 0 1px 0 0; padding: 4px 10px; width: 60px; height: 20px; color: #FFF; text-align: center; text-decoration: none;}.set_bor ul li a:hover{ cursor: pointer;}.set_bor ul div{ position: absolute; visibility: hidden; margin: 0; padding: 0; background: #EAEBD8;}.set_bor ul div a{ position: relative; display: block; margin: 0; width: auto; white-space: nowrap; text-align: left; text-decoration: none; background: #C5E1F4; color: #2D2D2D;}.set_bor ul div a:hover{ background: #49A3FF; color: #FFF;}</style></head><body><div style="float:left;">正文文本</div><div class="set_bor"><ul><li><a>UL列表</a><div id="div_4" style="display:inline;"> <a href='javascript:'>新建</a></div></li></ul></div></body></html>
[解决办法]
<body>
<div style="float:left;">
正文文本
</div>
<ul>
<li>
<a>UL列表</a>
<div id="div_4">
<a href='javascript:'>新建</a>
</div>
</li>
</ul>
</body>