css让文字,字母折行
加上如下的CSS设置,就是设定好宽度width,然后设置合适的word-wrap和word-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让文字,字母折行的更多相关文章
- 文本超出显示省略号/数字英文字母折行有关css 属性/显示两行,第二行省略号显示css方法
		
文本超出显示省略号: 定容器宽度 overflow: hidden; text-overflow: ellipsis; 文本超出显示省略号 white-space:nowrap; 强制文本不换行 折 ...
 - 使用css控制文字显示几行并且剩余部分隐藏(移动端和PC端同样适用)
		
前言 有些需求需要我们控制一段文本最多显示几行,就像逛淘宝京东的评价楼层一样,有时可能还需要隐藏剩余部分,这样的需求我们怎么来解决呢? 解决办法 我们完全可以使用css来解决这一需求 1. 解决文本显 ...
 - css让文字显示特定行数,多余的显示省略号
		
/*css*/ .p{ width: 200px; word-break: break-all; text-overflow: ellipsis; display: -webkit-box; /** ...
 - iOS - UIButton折行文字显示设置
		
首先在控制器中创建一个button - (void)viewDidLoad { [super viewDidLoad]; UIButton * button = [[UIButton alloc] i ...
 - span 右浮动折行 解决ie6/7中span右浮动折行问题
		
A floated box is shifted to the left or right until its outer edge touches the containing block edge ...
 - 文字折行不折行 css
		
white-space : 1. normal 默认值 ,文字自动换行. 2. pre 使用<pre>标签形式,表示元素. * ...
 - css文字单行/多行超出显示省略号...
		
css文字单行/多行超出显示省略号... 项目里写css样式我们经常会遇到将文字超出显示省略号的情况,记录一下以后能用到. 单行超出 .oneline { width:300upx; /*宽度一定要设 ...
 - UIlabel多行文字自动换行 (自动折行)
		
UIView *footerView = [[UIView alloc]initWithFrame:CGRectMake(, , , )]; UILabel *label = [[UILabel al ...
 - 纯css控制文字2行显示多余部分隐藏
		
在编写页面的时候,经常遇到一些地方的文字显示1行,多余的文字隐藏,这样显示1行的很好控制: css代码如下: white-space: nowrap; overflow: hidden; text-o ...
 
随机推荐
- Python集合的常用方法
			
注释很详细 collection={,,"apple","orange","cat"} # 查看一个数是否在集合中 in print(&qu ...
 - C# 将一种类型的数组转化为另一种类型的数组
			
//字符串数组(源数组) "}; //整型数组(目标数组) int[] iNums; //转换方法 iNums = Array.ConvertAll<string, int>(s ...
 - SQL游标示例
			
DECLARE @@totalNum INT;SET @@totalNum=0;DECLARE @num INT;DECLARE @CustomInfo NVARCHAR(MAX);DECLARE M ...
 - 多线程之thread和runnable
			
Runnanle方式可以避免Thread由于单继承特性带来的缺陷. Runnable代码可以被多个线程(thread实例)共享,适用于多个线程处理同一资源的情况. 线程的生命周期:创建,就绪,阻塞,运 ...
 - jQuery实现购物车效果
			
简单的购物车效果 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
 - IDEA的第一个java程序
			
import java.util.Scanner;public class 阶乘{ public static void main(String[] args) { int sum=1,i; Scan ...
 - vue打包后找不到资源路径问题
			
问题描述: 使用webpack打包vue项目后,前后端联调无法找到资源 解决方案: 一. 改为相对路径,去除axios中地址的第一个“/” onProxyReq: function (proxyReq ...
 - vue打包dist文件时,图片找不到
			
1.vue打包dist文件时,图片找不到,无法像在本地一样查看 问题描述: 本地代码:<div class="icon"><img :src="'../ ...
 - ThinkPHP模板继承和修改title
			
先说下模板继承: 假定:在View文件夹中 -> Public 公共模块 —>base/header/top/footer 4个html文件 这下面base文件使用include引入其他 ...
 - Linux内核移植的若干问题