强制ul中li不换行

<style type="text/css">

<!--

#dh {

    width: 300px;

    overflow: hidden;

    height: 30px;

    background-color: #CCCCCC;

    border: 1px solid #999999;

}

#dh li {

    float: left;

    white-space: nowrap;

}

-->

</style>

<ul id="dh">

  <li>无序列表条目1</li>

  <li>无序列表条目2</li>

  <li>无序列表条目3</li>

  <li>... ...</li>

</ul>

  以上代码有一问题解决不了,请各们帮忙。 

  要求:ul宽度高度固定,li可能有多个,但需要排列在一行中,超出ul宽度的部分自动隐藏(注:要求不换行),兼容ie、firefox。

  现在的问题是,不超出ul宽度的li可以排在一行中。但后边的li自动换行了。有没有办法让后边的li继续排在一行中。试过在li样式中加clear:right;在ie6下正常,但ie8、ff无效。不知各位有何良方。

时间: 2024-07-30 23:27:19

强制ul中li不换行的相关文章

javascript操作ul中li的方法

  本文实例讲述了javascript操作ul中li的方法.分享给大家供大家参考.具体如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 <!DOCTYPE html PUBLIC "-//W3C//DT

Jquery和JS获取ul中li标签的实现方法_jquery

js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElementsByTagName("ul"); var itemss=items[2].getElementsByTagName("li");//获取第二个li标签 或 var div=document.getElementById('a'); var ul=div.childN

javascript操作ul中li的方法_javascript技巧

本文实例讲述了javascript操作ul中li的方法.分享给大家供大家参考.具体如下: <!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"> &l

DIV CSS网页布局中常用的列表元素ul ol li dl dt dd释义

核心提示:DIV CSS网页布局中常用的列表元素ul ol li dl dt dd释义 ol 有序列表 <ol><li>--</li><li>--</li><li>--</li></ol> 表现为 1--2--3-- ul 无序列表,表现为li前面是大圆点而不是123 <ul><li>--</li><li>--</li></ul> 很多人容

网页布局中常用的列表元素ul ol li dl dt dd讲解

网页 DIV CSS网页布局中常用的列表元素ul ol li dl dt dd释义,块级元素div尽量少用,和table一样,嵌套越少越好 ol 有序列表. <ol><li>--</li><li>--</li><li>--</li></ol> 表现为: 1--2--3-- ul 无序列表,表现为li前面是大圆点而不是123 <ul><li>--</li><li>-

jQuery在ul中显示某个li索引号的方法

 这篇文章主要介绍了jQuery在ul中显示某个li索引号的方法,涉及jQuery遍历元素的技巧,非常具有实用价值,需要的朋友可以参考下     本文实例讲述了jQuery在ul中显示某个li索引号的方法.分享给大家供大家参考.具体分析如下: 这段代码不仅适用于ul和li的元素索引号查找,也适用于其它带有包含关系的元素索引号查找,方法非常的巧妙 ? 1 2 3 4 5 $("ul > li").click(function () { // http://www.jb51.net

tree-请问如何将html中两个或多个具有相同层次结构和内容的ul或li合并在一起?

问题描述 请问如何将html中两个或多个具有相同层次结构和内容的ul或li合并在一起? 合并前的HTML内容如下: <ul class="ul1"> <li> <p>中国</p> <ul class="ul2"> <li> <p>广东</p> <ul class="ul3"> <li> <p style="col

jQuery在ul中显示某个li索引号的方法_jquery

本文实例讲述了jQuery在ul中显示某个li索引号的方法.分享给大家供大家参考.具体分析如下: 这段代码不仅适用于ul和li的元素索引号查找,也适用于其它带有包含关系的元素索引号查找,方法非常的巧妙 $("ul > li").click(function () { // http://www.jb51.net var index = $(this).prevAll().length; //prevAll([expr]): 查找当前元素之前所有的同辈元素 }); 希望本文所述对大

根据ul里li中文本排序

问题描述 根据ul里li中文本排序 <html> <head> <title></title> </head> <body> <ul id="ul1"> <li>2</li> <li>5</li> <li>1</li> <li>4</li> <li>3</li> </ul>