文档章节

[转载]css控制文字换行

Kilar
 Kilar
发布于 2015/12/08 16:18
字数 307
阅读 11
收藏 0
点赞 0
评论 0

 .zjtext{ font-size:12px; color:#fff; padding:5px; width:100px;white-space:normal; overflow:hidden; }

以上是我引用的,关键语:white-space:normal; overflow:hidden;

强制不换行
p.www_52css_com {
  white-space:nowrap;
  }
自动换行
p.www_52css_com {
  word-wrap: break-word;
  word-break: normal;
  }
强制英文单词断行
p.www_52css_com {
  word-break:break-all;
  }

CSS设置不换行:

  overflow:hidden 溢出隐藏
  white-space:nowrap 不换行
  pre 换行和其他空白字符都将受到保护
  nowrap 强制在同一行内显示所有文本,直到文本结束或者遭遇br对象

CSS设置强制换行:

  word-break:break-all 强制断开实现转行
  normal ; 依照亚洲语言和非亚洲语言的文本规则,允许在字内换行
  break-all : 该行为与亚洲语言的normal相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本
  keep-all : 与所有非亚洲语言的normal相同。对于中文,韩文,日文,不允许字断开。适合包含少量亚洲文本的非亚洲文本与之间的高度解决办法
  设置或检索对象内文本的字内换行行为。尤其在出现多种语言时。对于中文,应该使用break-all 。


© 著作权归作者所有

共有 人打赏支持
Kilar
粉丝 5
博文 63
码字总数 2416
作品 0
肇庆
程序员
CSS的word-break 属性

<!DOCTYPE html><html><head><style> p.test1{width:150px; border:1px solid #000000; } p.test2{width:150px; border:1px solid #000000; }</style></head><body> <p class="test1">This i......

徐建兴 ⋅ 2014/03/14 ⋅ 0

div、p、td 的强制不换行及强制换行

关于强制不换行、强制换行的话题在网上已经被讨论了无数次,但我发现都不够全面,没有充分考虑各种浏览器、各种标签等情况,以致不兼容,所以我再来说说。由于 div 和 p 在本文的讨论中,效果...

王超 ⋅ 2014/03/20 ⋅ 0

解决文字和text-decoration:underline下划线重叠问题

解决文字和text-decoration:underline下划线重叠问题 张鑫旭-鑫空间-鑫生活2016-11-2240 阅读 box-shadowgradientcanvasfilterborder by zhangxinxu from http://www.zhangxinxu.com/wordpr......

张鑫旭-鑫空间-鑫生活 ⋅ 2016/11/22 ⋅ 0

跨浏览器开发经验总结(二) —— CSS

css hack的使用 CSS类级别的hack仅IE7识别 +html {…} IE6及IE6以下识别 html {…} opera、safari、chrome识别: @media all and (min-width: 0px){…} //Firefox3.0.6不识别,但Firefox3.6也......

leenash ⋅ 2010/09/08 ⋅ 2

div+CSS设置一行内文字超过宽度不换行且不显示

当一行文字超过DIV或者Table的宽度的时候,浏览器中默认是让它换行显示的,如果我们不想让他换行显示那要怎么办呢?看到这个标题很容易就会想到截断文字加“...”的做法。 一般的文字截断(适...

emberma ⋅ 2014/06/25 ⋅ 0

表格内部文字自动换行技巧

在使用Dreamweaver制作网页时,遇到制作表格的时候,内部的文字没有自动换行,我应该怎么做呢?下面提出两种解决方案,大家可以参考! 在这里你如果知道该技巧,你可以略过!如果你不知道,不...

xiaodaiyy11 ⋅ 2011/12/15 ⋅ 0

一个demo学会css

全栈工程师开发手册 (作者:栾鹏) 一个demo学会css css选择器全解 css操作语法全解 学习了css权威指南这本书,自己喜欢边学边总结边写demo,所以写了这篇文章,包含了大部分的css编程知识。...

luanpeng825485697 ⋅ 2017/08/03 ⋅ 0

div和表格中文字溢出时折行显示的处理

当一行文字超过DIV或者Table的宽度的时候,浏览器中默认是让它换行显示的,如果我们不想让他换行显示那要怎么办呢?看到这个标题很容易就会想到截断文字加“...”的做法。 一般的文字截断(适...

prfy520 ⋅ 2013/12/18 ⋅ 0

zwmobi 程序如何制作个性化彩版模版指南

彩版布局因采用CSS所以可以用到比较多布局元素,下面就跟我一起来个性化修改整个程序模版吧。 因为系统有多套模版CSS可定义功能,如果你想打造个性化的模版,同时又不受系统太多的影响,比如...

李华123 ⋅ 2010/12/29 ⋅ 0

CSS常用样式整理

1.text-indet: 2em,文字开头空2格; 2.white-space: 属性设置如何处理元素内的空白(空格、换行和tab字符)的处理。 normal 默认,空白会被浏览器忽略;pre 空白会被浏览器保留;nowrap 文本...

w-rain ⋅ 2015/05/29 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

HiSDP —— 高效的C++软件开发平台

目前阿里集团每天有近1000PB的数据是通过LogAgent采集的,为了让LogAgent做到资源占用节省和高效采集,背后是基于HiSDP去构建的。 缘由 当决定采用C++编程语言去开发一个软件时,紧接着所面临...

阿里云云栖社区 ⋅ 15分钟前 ⋅ 0

zookeeper-3.4.12 下载与安装教程

一、zookeeper下载地址 http://mirrors.hust.edu.cn/apache/zookeeper/ 二、启动教程 把压缩包放在指定目录下 第三: 进入 conf文件夹底下 zoo_sample.cfg 文件名改成 zoo.cfg 第四步: 进入b...

泉天下 ⋅ 16分钟前 ⋅ 0

Oracle 中文日期转换

SELECT TO_date('2011年11月11日', 'yy"年"mm"月"dd"日"') FROM DUAL; 1. Oracle无法识别中文格式,所以添加双引号。 2. 后面的格式是指字符串在转换前的格式,而不是指转换后的格式。...

江戸川 ⋅ 18分钟前 ⋅ 0

MySell:API Spring Boot

起步 类目 商品 订单

BeanHo ⋅ 20分钟前 ⋅ 0

Spring方法拦截器MethodInterceptor

参考资料 1、Spring方法拦截器MethodInterceptor 2、Sharding JDBC源码分析-JdbcMethodInvocation类的作用

哎小艾 ⋅ 23分钟前 ⋅ 0

正则表达式

元字符 元字符,又叫字符集,就是用一些特殊符号表示特定种类的字符或位置。 匹配字符 . 匹配除换行符以外的任意字符 \w 匹配字母或数字或下划线或汉字 \s 匹配任意的空白符 \d 匹配数字 匹配...

wangchen1999 ⋅ 23分钟前 ⋅ 0

数据库数据导入Elasticsearch案例分享

基于bboss持久层和bboss elasticsearch客户端实现数据库数据导入es案例分享(支持各种数据库和各种es版本) 1.案例对应的源码 https://gitee.com/bboss/bboss-elastic/blob/master/bboss-el...

bboss ⋅ 24分钟前 ⋅ 0

动手---sbt(2)

参考 https://blog.csdn.net/leishangwen/article/details/46225587 建立一个chisel_max目录,文件内容如后面所述,现在开始执行命令: joe@joe-Aspire-Z3730:/media/sdb4/download/scala$ c......

whoisliang ⋅ 31分钟前 ⋅ 0

纯js实现最简单的文件上传(后台使用MultipartFile)

<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>XMLHttpRequest上传文件</title> <script type="text/javascript"> //图片上传 var xhr......

孟飞阳 ⋅ 36分钟前 ⋅ 0

iOS宇宙大战游戏、调试工具、各种动画、AR相册、相机图片编辑等源码

iOS精选源码 日期时间选择器,swift Space Battle 宇宙大战 SpriteKit游戏源码 LLDebugTool - 便捷的IOS调试工具(新增截屏功能) 相机扫描or长按识别二维码、FMDB、键盘动态高度、定位等 动画...

sunnyaigd ⋅ 37分钟前 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部