为什么HTML 设置ul左浮动 为什么没有水平显示

<style type="text/css">
ul
{
float:left; width:800px; height:30px;
}
</style>
</head>
<body>
<ul>
<li>佳能</li>
<li>索尼</li>
<li>三星</li>
<li>尼康</li>
<li>松下</li>
<li>卡西欧</li>
</lu>
</body>
</html>

    你应该设置浮动给li,而不是ul

    ul是包含很多li的,给ul浮动是没用的,可以给ul设置宽度,多个ul

    多个ul存在,可以使用浮动,但是注意宽度

温馨提示:答案为网友推荐,仅供参考
第1个回答  2017-09-01

您好,您要表达的是否为:ul下面的li要水平显示呢?

如果是的话,要将li设置为左浮动,这样就可以了。

如果不是的话,是否为:跟ul同级元素也要在一行呢?

如果是的话,要将同级元素也设置左浮动。

最后,为了保证不影响其他标签的正常显示,别忘记清理浮动哦!

清理办法:

    将浮动元素的父级元素设置overflow:hidden(此方法在有下拉菜单的时候省略);

    将浮动元素的父级元素添加个伪元素,方法:div:after{content:"";line-height:0;clear:both;};

    在浮动元素下面写个空的块级标签。

    希望能够帮到您!

第2个回答  2014-10-21
li 是UL 里边的一个元素了, 也就是说,无论你对ul执行了何种设置, 里边的li都会相应的也去执行这个设置。 所以,你的li里的float:left 是在ul的padding的基础上再浮动居左的.追问

我没有设置padding呀, 单纯的想水平显示而已

第3个回答  2017-08-15

补充:刚才回答时没有看到你发的代码:你那css定义错误,你可以改成定义li  就可以了

参考代码:

<style>
*{ margin:0; padding:0; list-style:none}
ul{ width:100px; height:100px; float:left; background:#00F; margin:10px;}
li{ width:30px; height:30px; float:left; background:#C30; margin:10px;}
</style>
</head>
<body>
<div>
    <ul>
        <li>a1</li>
        <li>a2</li>
    </ul>
    <ul>
        <li>b1</li>
        <li>b2</li>
    </ul>
</div>

应该不会有问题才是,注意要指定元素的高度和宽度,,还有关注一个点就是块级元素和行内元素的区别,块级元素自站一行,要设置浮动才可以在一行显示,而行内元素本身就在一行显示,所以不用使用浮动,关于块级元素和行内元素的更多详细了解,可以参考资料:http://www.sunyisong.cn/post-19.html,希望回答可以帮助你

第4个回答  2017-09-11
浮动要对li设置啊。 对ul设置当然不起作用啊。
记得给ul清除浮动效果