css 强制不换行
强制不换行
div{
white-space:nowrap;
}
自动换行
div{
word-wrap: break-word;
word-break: normal;
}
强制英文单词断行
div{
word-break:break-all;
}
CSS设置不转行:
overflow:hidden 隐藏
white-space:normal 默认
pre 换行和其他空白字符都将受到保护
nowrap 强制在同一行内显示所有文本,直到文本结束或者遭遇 br 对象
设置强行换行:
word-break:
normal ; 依照亚洲语言和非亚洲语言的文本规则,允许在字内换行
break-all : 该行为与亚洲语言的normal相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本
keep-all : 与所有非亚洲语言的normal相同。对于中文,韩文,日文,不允许字断开。适合包含少量亚洲文本的非亚洲文本与之间的高度解决办法
英文不换行
CSS里加上 word-break: break-all; 问题解决。这个问题只有IE才有,在FF下测试,FF可以自己加滚动条,这样也不影响效果
建议大家做Skin时,记得在body里加 word-break: break-all; 这样可以解决IE的框架被英文撑开的问题
以下引用word-break的说明, 注意word-break 是IE5+专有属性
语法:
word-break : normal | break-all | keep-all
参数:
normal : 依照亚洲语言和非亚洲语言的文本规则,允许在字内换行
break-all : 该行为与亚洲语言的normal相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本
keep-all : 与所有非亚洲语言的normal相同。对于中文,韩文,日文,不允许字断开。适合包含少量亚洲文本的非亚洲文本
说明:
设置或检索对象内文本的字内换行行为。尤其在出现多种语言时。
对于中文,应该使用break-all 。
对应的脚本特性为wordBreak。请参阅我编写的其他书目。
示例:
div {word-break : break-all; }
css 强制不换行的更多相关文章
- CSS强制中英文换行与不换行
1. word-break:break-all; 只对英文起作用,以字母作为换行依据 2. word-wrap:break-word; 只对英文起作用,以单词作为换行依据 3. white-space ...
- CSS强制英文换行
1. word-break:break-all;只对英文起作用,以字母作为换行依据 2. word-wrap:break-word; 只对英文起作用,以单词作为换行依据 3. white-space: ...
- css强制不换行 多出的字省略号
width: 100%;//需要指定宽度 overflow: hidden;//溢出隐藏 text-overflow: ellipsis; white-space: nowrap;//强制不换行 te ...
- [js]纯css强制不换行
要加在li上 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...
- CSS样式自动换行(强制换行)与强制不换行
自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法 对于div,p等块级元素,正常文字的换行(亚洲文字和非亚洲文字)元素拥 ...
- css实现强制不换行/自动换行/强制换行
在我们日常的编码中经常会遇到这段文字不可以换行,或者自动换行的需求.虽然这个功能在我们平时很常见但是我相信大家一定不会可以的去记住它吧(至少小月是很懒惰的从来是用什么查什么 ♦ 嘻嘻...).今天我们 ...
- CSS - 如何实现强制不换行、自动换行、强制换行 以及 chrom默认焦点 IE下 Input 默认出现叉
*:focus {outline: none;} input::-ms-clear {display:none;} 一般的文字截断(适用于内联与块): .text-overflow { display ...
- css 强制换行
强制不换行 div{white-space:nowrap;} 自动换行div{ word-wrap: break-word; word-break: normal; } 强制英文单词断行div{wor ...
- css强制html不换行 css强制英文单词断行 重拾丢失的
css强制html不换行 css强制英文单词断行 强制不换行 div{ white-space:nowrap; } 自动换行 div{ word-wrap: break-word; word-brea ...
随机推荐
- IE,Chrome滚动条样式CSS
<style type="text/css"> *{ scrollbar-face-color:#F3F3F3; /*面子*/ scrollbar-arrow-colo ...
- java 数据结构
二叉树: 存储结构:顺序存储结构和链式存储结构 二叉树的先根遍历的递归与非递归算法 二叉树的中根遍历的递归与非递归算法 二叉树的后根遍历的递归与非递归算法 二叉树的层次遍历的递归与非递归算法 e.g. ...
- POJ3352 Road Construction (双连通分量)
Road Construction Time Limit:2000MS Memory Limit:65536KB 64bit IO Format:%I64d & %I64u Sub ...
- adb shell am force-stop <package>
•adb shell am force-stop <package>关闭程序的adb命令
- Grid Infrastructure Single Client Access Name (SCAN) Explained (文档 ID 887522.1)
APPLIES TO: Oracle Database - Enterprise Edition - Version 11.2.0.1 and laterExalogic Elastic Cloud ...
- xdg-open 打开“irc:*”链接
用于打开chrome浏览器中的"irc://*" #cp /usr/share/applications/xchat.desktop /home/zsj/.local/share/ ...
- Spring 配置文件详解 http://www.blogjava.net/hellxoul/archive/2011/11/19/364324.html
1.基本配置: <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http: ...
- Android——主流分辨率
VGA:480*640 QVGA:240*320 HVGA:320*480 WVGA:480*800 FWVGA:480*854 IntelHaxm.exe 模拟器加速器
- 在页面中使用Eval的两种方案
①直接取<%#Eval("name")%> ②进行运算<%#Convert.ToInt32(Eval("count"))-(Eval(&quo ...
- 在linux中安装和卸载mysql
[安装] 已经获取到linux版本的mysql安装包,包括mysql的server(服务端)和client(客户端)的安装包,假设安装包为: MySQL-server-5.0.22-0.i386.rp ...