博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
CSS换行和不换行
阅读量:6978 次
发布时间:2019-06-27

本文共 740 字,大约阅读时间需要 2 分钟。

强制不换行

div{white-space:nowrap;}

自动换行

div{ word-wrap: break-word; word-break: normal; }

强制英文单词断行

div{word-break:break-all;}

超出显示省略号

p{
text-overflow:ellipsis;overflow:hidden;}

white-space: normal|pre|nowrap|pre-wrap|pre-line|inherit;

white-space 属性设置如何处理元素内的空白
normal 默认。空白会被浏览器忽略。
pre 空白会被浏览器保留。其行为方式类似 HTML 中的 pre 标签。
nowrap 文本不会换行,文本会在在同一行上继续,直到遇到 br 标签为止。
pre-wrap 保留空白符序列,但是正常地进行换行。
pre-line 合并空白符序列,但是保留换行符。
inherit 规定应该从父元素继承 white-space 属性的值。

word-wrap: normal|break-word;

word-wrap 属性用来标明是否允许浏览器在单词内进行断句,这是为了防止当一个字符串太长而找不到它的自然断句点时产生溢出现象。
normal: 只在允许的断字点换行(浏览器保持默认处理)
break-word:在长单词或URL地址内部进行换行
word-break: normal|break-all|keep-all;

word-break 属性用来标明怎么样进行单词内的断句。

normal:使用浏览器默认的换行规则。
break-all:允许再单词内换行
keep-all:只能在半角空格或连字符处换行

转载地址:http://fdypl.baihongyu.com/

你可能感兴趣的文章
android:关于主工程和library project
查看>>
Windows 7 开发新特性
查看>>
在客户端调用MOSS的搜索服务,实现更加灵活的搜索控制
查看>>
C++:STL标准入门汇总
查看>>
1001: 整数求和
查看>>
How to develop Silverlight 4 using Visual Studio Express 2010
查看>>
浏览器前进后退对下拉框数据的丢失(省市联动实现和例子)
查看>>
构建安全的 ASP.NET 应用程序
查看>>
从源代码编译里程碑的 ICS ROM
查看>>
Flex通信-Java服务端通信实例
查看>>
Nginx学习笔记(一) Nginx架构
查看>>
JavaScript sync and async(同步和异步)
查看>>
.Net Winform 开发笔记(四) 透过现象看本质
查看>>
Linux下显示硬盘空间的两个命令
查看>>
What’s new: Windows Phone 7 与 Windows Phone 6.5功能对比
查看>>
用Swift实现一款天气预报APP(三)
查看>>
HttpApplication事件&ASP.NET页面周期
查看>>
春天。
查看>>
MapReduce对交易日志进行排序的Demo(MR的二次排序)
查看>>
Android -- Fragment注意事项
查看>>