DIV强制不换行

来源:互联网 发布:广电网络自助缴费 编辑:程序博客网 时间:2024/05/16 12:48

 

让DIV不换行



一,单个DIV:
1.用nobr元素
Code: 
<html>
<head>
</head>
<body>
<div><nobr>不换行不换行<nobr></div>
</body>
</html>


2.用nowrap元素
Code: 
<html>
<head>
</head>
<body>
<div nowrap>div不换行div不换行div不换行</div>
</body>
</html>
 

二,两个DIV
1. 用CSS里的float属性
Code: 
<html>
<head>
<style type="text/css">
div#row1 float: left; color: blue; }
div#row2 color: red }
</style>
</head>
<body>
<div id="row1">第一个div</div>
<div id="row2">第二个div不换行</div>
</body>
</html>
 

2. 用CSS里的diplay属性
Code: 
<html>
<head>
<title>CSS中的不换行</title>
<style type="text/css">
div#row1 color: blue;display: inline }
div#row2 color: red;display: inline }
</style>
</head>
<body>
<div id="row1">第一个div</div>
<div id="row2">第二个div不要换行</div>
</body>
</html>

<nobr> 作为定义外观的标签,在 W3C 里未被采用。要用样式表来实现禁止换行的效果的话,请在 white-space 里指定 nowrap。
<div style="white-space: nowrap;">
即使浏览器的横幅不够,这里也不会换行。
</div>