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 ...
随机推荐
- Visual Studio 生成DLL文件
新建一个项目,在菜单栏中选择“项目”/“**属性”选项,该页面中将“输出类型”下拉列表中的选项选择为“类库”,然后重新生成一下该项目,或者在“Visual Studio 2008命令提示”中输入以下命 ...
- ZooKeeper全面介绍
ZooKeeper简介 ZooKeeper是分布式服务框架,主要是用来解决分布式应用中经常遇到的一些数据管理问题,如:统一命名服务.状态同步服务.集群管理.分布式应用配置项的管理等等. ZooKe ...
- 五、VueJs 填坑日记之将接口用webpack代理到本地
上一篇博文,我们已经顺利的从cnodejs.org请求到了数据,但是大家可以注意到我们的/src/api/index.js的第一句就是: // 配置API接口地址 var root = 'https: ...
- 为你解读2017年Java开发前景如何
社会上普遍认为程序员是一份高薪职业,确实,相较于其他行业,大多数工作1-3年的程序员年收入都在10-20万.据权威机构统计,在所有的软件开发类人才中对Java开发人才的需求量最大,达到了60%-70% ...
- Linux系列教程(二十三)——Linux的服务管理
前面我们讲解Linux软件包管理之源码包.脚本安装包时,我们介绍了rpm包和源码包由于安装位置的不同,会对服务的启动造成影响,具体是什么,本篇博客我们来详细介绍. 1.Linux服务管理总览 我们可以 ...
- java 中 “文件” 和 “流” 的简单分析
java 中 FIle 和 流的简单分析 File类 简单File 常用方法 创建一个File 对象,检验文件是否存在,若不存在就创建,然后对File的类的这部分操作进行演示,如文件的名称.大小等 / ...
- 为Spark Application指定不同的JDK版本
随着企业内部业务系统越来越多,基于JVM的服务,通常情况线上环境可能会有多套JDK跑不同的服务.大家都知道基于高版本的Java规范编写的服务跑在低版本的JVM上会出现:java.lang.Unsupp ...
- JavaEE中的MVC(二)Xml配置实现IOC控制反转
毕竟我的经验有限,这篇文章要是有什么谬误,欢迎留言并指出,我们可以一起讨论讨论. 我要讲的是IOC控制反转,然后我要拿它做一件什么事?两个字:"解耦",形象点就是:表明当前类中需要 ...
- Java数据结构和算法(五)——队列
前面一篇博客我们讲解了并不像数组一样完全作为存储数据功能,而是作为构思算法的辅助工具的数据结构——栈,本篇博客我们介绍另外一个这样的工具——队列.栈是后进先出,而队列刚好相反,是先进先出. 1.队列的 ...
- webpack中实现按需加载
webpack中的require.ensure()可以实现按需加载资源包括js,css等,它会给里面require的文件单独打包,不和主文件打包在一起,webpack会自动配置名字,如0.js,1.j ...