过长文字自动换行的技巧 Word-Break Word-Wrap
在很多时候,为了防止内容过长把表格或容器撑破, 我们都需要为容器加上自动换行的功能。
实现自动换行,用CSS来实现,通常有两种方式:
- word-break:
取值为 normal, break-all, keep-all
- word-wrap:
取值为 normal, break-word
word-break: break-all 太霸道,无条件折行,会造成 英文单词 和 数字的断行,不建议使用。
推荐使用的是:
首先新建html文件,将下面的代码考入:
{word-wrap: break-word; overflow: hidden; text-overflow: ellipsis;}
对 FF3 应该是兼容的。
来自:http://goodboy5264.blog.163.com/blog/static/253829820091110305144/
过长文字自动换行的技巧 Word-Break Word-Wrap的更多相关文章
- LeetCode ||& Word Break && Word Break II(转)——动态规划
一. Given a string s and a dictionary of words dict, determine if s can be segmented into a space-sep ...
- 17. Word Break && Word Break II
Word Break Given a string s and a dictionary of words dict, determine if s can be segmented into a s ...
- LeetCode之“动态规划”:Word Break && Word Break II
1. Word Break 题目链接 题目要求: Given a string s and a dictionary of words dict, determine if s can be seg ...
- leetcode@ [139/140] Word Break & Word Break II
https://leetcode.com/problems/word-break/ Given a string s and a dictionary of words dict, determine ...
- canvas文字自动换行、圆角矩形画法、生成图片手机长按保存、方形图片变圆形
canvas的文字自动换行函数封装 // str:要绘制的字符串 // canvas:canvas对象 // initX:绘制字符串起始x坐标 // initY:绘制字符串起始y坐标 // lineH ...
- 使用echart的雷达图的时候,如果文字越界的解决办法记录,标签文字自动换行
使用echart的雷达图的时候,如果文字越界的解决办法记录,标签文字自动换行 前几天项目中有一个图表的是用echart生成的,遇到一个问题,就是在手机端显示的售时候,如果文字太长就会超出div,之前的 ...
- [Leetcode Week9]Word Break II
Word Break II 题解 题目来源:https://leetcode.com/problems/word-break-ii/description/ Description Given a n ...
- 【Word Break II】cpp
题目: Given a string s and a dictionary of words dict, add spaces in s to construct a sentence where e ...
- word break和word wrap
默认情况下,如果同一行中某个单词太长了,它就会被默认移动到下一行去: word break(normal | break-all | keep-all):表示断词的方式 word wrap(norma ...
随机推荐
- img与父元素的间隙解决
近来在做H5页面时,突然发现一个问题,使用一个div包裹一个img,在手机预览时,发现图片与div之间有间隙. 当时第一反应就是,是不是间距没有设置为0,于是预览了下代码: .active img { ...
- 会话跟踪技术——cookie
一.会话控制 为了使得网站可以跟踪客户端与服务器之间的交互,保存和记忆每个用户的身份和信息,我们需要一种强有力的解决方案,这样就产生了会话控制. HTTP是一个无状态的协议,此协议无法来维护两个事务之 ...
- white-space:nowrap 的妙用
对于多个元素同在同一行的布局,如比较常见的是轮播.下面我将探讨这这一布局的做法: 首先约定html结果如下: div.row div.col div.col div.col ... 做法一: 设定di ...
- JMS - Message
一条 JMS 消息包含三个部分:消息头.消息属性和消息体. 消息头 消息头提供了和消息有关的元数据,它描述了消息有谁创建.何时创建.数据的有效长度等信息.消息头还包含了描述消息目的地(主题或队列)的路 ...
- 【Knockout】五、创建自定义绑定
概述 除了上一篇列出的KO内置的绑定类型(如value.text等),你也可以创建自定义绑定. 注册你的binding handler ko.bindingHandlers.yourBindingNa ...
- ios Swift 特性
特性提供了关于声明和类型的更多信息.在Swift中有两类特性,用于修饰声明的以及用于修饰类型的.例如,required特性,当应用于一个类的指定或便利初始化器声明时,表明它的每个子类都必须实现那个初始 ...
- 【ios控件】UIScrollView 事件说明
// // UIDemoViewController.m // 06-1UIScrollDemo // // Created by k on 14-9-4. // Copyright (c) 2014 ...
- (转)卸载和安装LINUX上的JDK
卸载默认的: 用root用户登陆到系统,打开一个终端输入 # rpm -qa|grep gcj 显示内容其中包含下面两行信息 # java-1.4.2-gcj-compat-1.4.2.0-27jpp ...
- JavaScript---Cookie
用JavaScript创建.获取.删除Cookie的例子 1.创建cookie function setCookies(cName,cValue,exTimes){ var d = new Date( ...
- UGUI之在场景中设置、修改标签和按钮
UnityGUI使用一个特殊的OnGUI()函数,在该函数中加入实现UI的脚本. 它一共有两种类型的接口:GUI.xxx()和GUILayout.xxx(). 第一种需要自动手写填写处于屏幕上的位置. ...