查看: 8741|回复: 0
打印 上一主题 下一主题

CSS常用技巧之一 禁止文字自动换行

[复制链接]
跳转到指定楼层
1#
发表于 2008-7-2 19:09:10 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
台州网址导航
white-space: nowrap

当中文文字很长的时候(中间没有空格也没有换行符号),不管是IE还是firefox,到达边界都会自动换行。
但是有的情况,我们并不希望这样。比如:当在几个li并排排列,不想让每行的最后的一个li的文字自动换行,那就可以用本属性了。

使用这个css属性之后,文本只有在遇到空格或者是换行符的时候才能换行

比如:

div{white-space: nowrap;}

<style type="text/css">
            div{width:300px;border:1px solid red;margin:10px;overflow:hidden;}
            .nowrap{white-space: nowrap;}
            </style>
            <div class="nowrap">
            这是一段很长的文字中间没有空格也没有换行它不会自动换行直到被截取掉<br />
            </div>
            <div>这是一段很长的文字中间没有空格也没有换行但它会自动换行<br /></div>

上面两个div里超宽的文字,第一个里面的被禁止换行,然后超宽的被截取了;第二个不做设置,于是自动换行了
分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏 转播转播 分享分享 分享淘帖
台州维博网络(www.tzweb.com)专门运用PHP+MYSQL/ASP.NET+MSSQL技术开发网站门户平台系统等。
您需要登录后才可以回帖 登录 | 注册

本版积分规则

网站推广
关于我们
  • 台州朗动科技(Tzweb.com)拥有多年开发网站平台系统门户手机客户端等业务的成功经验。主要从事:政企网站,系统平台,微信公众号,各类小程序,手机APP客户端,浙里办微应用,浙政钉微应用、主机域名、虚拟空间、后期维护等服务,满足不同企业公司的需求,是台州地区领先的网络技术服务商!

Hi,扫描关注我

Copyright © 2005-2026 站长论坛 All rights reserved

Powered by 站长论坛 with TZWEB Update Techonolgy Support

快速回复 返回顶部 返回列表