加上如下的CSS设置,就是设定好宽度width,然后设置合适的word-wrapword-break属性:

.breakAll{
white-space:normal;
word-break:keep-all;
word-wrap: break-word;
}

word-warp 属性设置如何处理单词的折行,可以取的值有ul里面的li折行其实跟其他块状(block)元素的折行都是一样的。以下是相关的CSS属性:

word-wrap: normal | break-word

word-break 属性设置如何处理单词折断,仅支持IE,可以取的值有:

word-break: normal | break-all | hyphenate

white-space 属性设置如何处理元素内的空白。可以取的值有:

white-space: normal | nowarp | pre | pre-line | pre-warp | inherit

经测试对中文也有效。

css让文字,字母折行的更多相关文章

  1. 文本超出显示省略号/数字英文字母折行有关css 属性/显示两行,第二行省略号显示css方法

    文本超出显示省略号: 定容器宽度 overflow: hidden; text-overflow: ellipsis; 文本超出显示省略号 white-space:nowrap;  强制文本不换行 折 ...

  2. 使用css控制文字显示几行并且剩余部分隐藏(移动端和PC端同样适用)

    前言 有些需求需要我们控制一段文本最多显示几行,就像逛淘宝京东的评价楼层一样,有时可能还需要隐藏剩余部分,这样的需求我们怎么来解决呢? 解决办法 我们完全可以使用css来解决这一需求 1. 解决文本显 ...

  3. css让文字显示特定行数,多余的显示省略号

    /*css*/ .p{ width: 200px; word-break: break-all; text-overflow: ellipsis; display: -webkit-box; /** ...

  4. iOS - UIButton折行文字显示设置

    首先在控制器中创建一个button - (void)viewDidLoad { [super viewDidLoad]; UIButton * button = [[UIButton alloc] i ...

  5. span 右浮动折行 解决ie6/7中span右浮动折行问题

    A floated box is shifted to the left or right until its outer edge touches the containing block edge ...

  6. 文字折行不折行 css

    white-space : 1. normal  默认值 ,文字自动换行.               2. pre 使用<pre>标签形式,表示元素.                 * ...

  7. css文字单行/多行超出显示省略号...

    css文字单行/多行超出显示省略号... 项目里写css样式我们经常会遇到将文字超出显示省略号的情况,记录一下以后能用到. 单行超出 .oneline { width:300upx; /*宽度一定要设 ...

  8. UIlabel多行文字自动换行 (自动折行)

    UIView *footerView = [[UIView alloc]initWithFrame:CGRectMake(, , , )]; UILabel *label = [[UILabel al ...

  9. 纯css控制文字2行显示多余部分隐藏

    在编写页面的时候,经常遇到一些地方的文字显示1行,多余的文字隐藏,这样显示1行的很好控制: css代码如下: white-space: nowrap; overflow: hidden; text-o ...

随机推荐

  1. 网络编程[第三篇]基于tcp协议实现远程连接

    需要用到subprogress模块来远程控制cmd控制台程序来得到控制台的输出信息 一.服务端 —— 控制输出信息 import socket import subprocess #socket实例化 ...

  2. Elastic Search快速上手(4):细节补充

    模糊搜索 可以进行模糊搜索: GET job/type1/_search { "query":{ "fuzzy":{ "title":{ & ...

  3. linux安装字体库(simSun为例)

    在开发过程中,发现报表打印,字体和默认字体不一样.本地开发环境(windows)没问题,但是远程linux一直出现这样的问题.经过排查发现linux没有安装中文字体库宋体. linux查看当前的字体库 ...

  4. vue开发中利用正则限制input框的输入(手机号、非0开头的正整数等)

    我们在前端开发中经常会碰到类似手机号输入获取验证码的情况,通常情况下手机号的输入需要只能输入11位的整数数字.并且需要过滤掉一些明显不符合手机号格式的输入,那么我们就需要用户在输入的时候就控制可以输入 ...

  5. windows服务与log4net应用

    有时候我们需要用到window服务来执行定时任务,然后配合log4net记录程序运行情况,这里简单记录下配置的整个过程以及注意要点: 一.添加windows服务 1.设计页面,右键添加安装程序

  6. ES6-数组的扩展-整理

    一.Array.from():负责把类似数组的对象以及可遍历的对象转为真正的数组 1.类似数组的对象 let arrayLike = { '0': 'a', '1': 'b', '2': 'c', l ...

  7. STM32启动BOOT0 BOOT1设置方法

    原理图 启动方式 第一种启动方式是最常用的用户FLASH启动.默认启动方式 第二种启动方式是STM32内嵌的SRAM启动.该模式用于调试 第三种启动方式是系统存储器启动方式,不建议使用这种,速度比较慢 ...

  8. jQuery EasyUI简介

    jQuery EasyUI 是一个基于 jQuery 的框架,集成了各种用户界面插件. jQuery EasyUI是一组基于jQuery的UI插件集合体,而jQuery EasyUI的目标就是帮助we ...

  9. docker-compose 编排文件小疑点

    在学习docker-compose的时候,查看了下st2中的docker-compose.yml文件,有个地方没搞明白 env_file 制定的文件路径,一开始以为是在对应的容器中的conf目录中,但 ...

  10. 从0到1写rtos:事件的控制块与通知

    任务的状态: 未创建:只定义了任务代码,未调用tTaskInit()初始化 就绪:任务已经创建完毕,且等待机会占用CPU运行 运行:任务正在占用CPU运行代码 延时:任务调用tTaskDelay()延 ...