CSS实现文字换行
强制不换行:div{ white-space:nowrap; }
自动换行: div{ word-wrap:break-word; word-break:normal; }
强制不换行
white-space : normal | pre | nowrap | pre-wrap | pre-line | inherit
normal ; 默认。空白会被浏览器忽略。
pre : 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
nowrap : 文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。
pre-wrap:保留空白符序列,但是正常地进行换行。
pre-line:合并空白符序列,但是保留换行符。
inherit:规定应该从父元素继承 white-space 属性的值。
设置强行换行
word-break : normal | break-all | keep-all
normal ; 依照亚洲语言和非亚洲语言的文本规则,允许在字内换行
break-all : 该行为与亚洲语言的normal相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本
keep-all : 与所有非亚洲语言的normal相同。对于中文,韩文,日文,不允许字断开。适合包含少量亚洲文本的非亚洲文本与之间的高度解决办法
CSS实现文字换行的更多相关文章
- css控制文字换行
1.word-wrap 设置为break-word时,文本中的长单词或url可以换行 <p style="width:100px;word-wrap:break-word;border ...
- css 段落文字换行问题
项目中遇到的一个小问题,以前没有注意到: 超链接超出父级元素,想着给a标签加宽度但是没有效果... 后来发现两个很好用的css属性 1.word-wrap 用来控制换行 取值: (1)normal ...
- Matplotlib数据可视化(3):文本与轴
在一幅图表中,文本.坐标轴和图像的是信息传递的核心,对着三者的设置是作图这最为关心的内容,在上一篇博客中虽然列举了一些设置方法,但没有进行深入介绍,本文以围绕如何对文本和坐标轴进行设置展开(对图像 ...
- css文字换行问题white-space:pre-line或者white-space:pre-wrap,解决word-wrap:break-word解决不了的
想让文字换行必须要写的那几个css样式就略过了.当一行文字是数字或字母时或者数字字母组合时会出现不换行局面,这时候加个word-wrap:break-word:就基本可以解决但是有种情况是它解决不了的 ...
- css 文字换行控制
强制不换行 white-space:nowrap 强制不换行,并显示省略号 word-wrap: normal; text-overflow: ellipsis; white-space: nowra ...
- 【CSS】【1】让DIV中的文字换行显示
<div style="white-space:normal;word-break:break-all;word-wrap:break-word;">data</ ...
- CSS文字换行详细解说
本文列举了兼容 IE 和 FF 地换行 CSS 推荐样式,详细介绍了word-wrap同word-break地区别.兼容 IE 和 FF 地换行 CSS 推荐样式: 最好地方式是 word-wrap: ...
- CSS 文字换行与不换行
1. 强制不换行 p{ white-space:nowrap; } 2. 自动换行 p{ word-wrap: break-word; word-break: normal; } 3. 强制英文单词断 ...
- css 文字换行
换行word-wrap: break-word 新起一行对长单词进行断句word-break:break-all 本行对长单词进行断句 不换行,强制一行white-space:nowrap table ...
随机推荐
- ByteArrayInputStream&ByteArrayOutputStream源码分析
#ByteArrayInputStream 源码 ``` public synchronized int read(byte b[], int off, int len) { if (b == nul ...
- 前端设计师如何提高UI界面中的阅读性
阅读体验是ui设计中必不可少的一项,良好的设计应该都是可读的设计,如果信息都无法正常而清晰的传达,那么设计就失去了意义.设计的可读性和排版设计息息相关,这也就跟设计师的设计功底息息相关.下面简单介绍文 ...
- get和post请求及函数调用模式
1.get和post请求的应用场景? get: 1.get请求获取(查询)数据 2.请求url长度比较短 3.可以被缓存 4.请求url可以作为浏览器书签 5.可以被保存在浏览器记录中 6.请求参数在 ...
- 加密代理和Retrofit解密Converter
最近在研究安卓的Retrofit框架,服务器的数据全部用加密算法加密了,发现无法使用"com.squareup.retrofit2:converter-gson:2.1.0"Jar ...
- 02-线性结构3 Reversing Linked List
题目 Sample Input: 00100 6 4 00000 4 99999 00100 1 12309 68237 6 -1 33218 3 00000 99999 5 68237 12309 ...
- DIV+CSS特殊符号的处理方法
: :; ;< <= => >? ?@ @^ ^_ _` `{ {| |} }~ ~--- ...
- 实时同步rsync+inotify
实时同步rsync+inotify 原创博文http://www.cnblogs.com/elvi/p/7658071.html #linux同步 #实时同步rsync+inotify,双向同步ino ...
- ssh中Hibernate懒加载,session问题的学习与理解
交代本项目中要求获取session的方式如下: public Session getCurrentSession() { // 增删改使用的session,事务必须是开启的(Required,即pro ...
- php使用rc4加密算法
/** * rc4加密算法,解密方法直接再一次加密就是解密 * @param [type] $data 要加密的数据 * @param [type] $pwd 加密使用的key * @retur ...
- springboot添加swagger2组件
swagger2是一个可以构建和调试RESTful API文档的组件,利用swagger2的注解可以快速的在项目中构建Api文档,并且提供了测试API的功能 1,引入依赖 <dependency ...