(1)

//在断点处换行

word-wrap: normal;

//允许在长单词进行换行

word-wrap: break-word;

(2)

white-space:怎么处理元素间的空白

white-space:nowrap 不换行

white-space:normal;默认。空白会被浏览器忽略。

white-space:pre-line;

保留空白,不换行

white-space:pre-wrap;

保留空白,换行

(3)text-overflow:ellipsis||clip||string

使用ellipsis的时候,必须配合overflow:hidden; white-space:nowrap; width:50%;这三个样式共同使用才会有效果

hover时候

text-overflow:inherit;
overflow:visible;

(4)多行文本溢出

overflow:hidden;

white-space: nowrap;

text-overflow:ellipsis;

-webkit-box-orient:vertical;

-webkit-line-clamp:2;

word-wrap,white-space和text-overflow属性的更多相关文章

  1. word wrap 解惑

    源起 我们经常需要“修复”一个老生常谈的“bug”,那就是文本的自动换行问题.在专业术语上,这种期望得到的渲染现象被称作“word wrap”,即文本处理器有能力把超出页边的整个词自动传到下一行. 在 ...

  2. 【CSS学习】--- overflow属性

    一.前言 在网页布局中,未处理的溢出元素绝对算得上是个“毒瘤”.因为如果一个“盒子”周围还有其它元素,而从这个盒子中溢出的元素会和盒子周围的元素发生层叠,并脱离了整个HTML元素,所以我们应当合理使用 ...

  3. 字体图标,盒子显隐,overflow属性,伪类设计边框,盒子阴影2d形变

    字体图标 ''' fa框架: http://fontawesome.dashgame.com/ 下载 => 引入css文件 引入字体图标库 <link rel="styleshe ...

  4. CSS display overflow 属性 cursor光标类型

    display属性   功能:规则网页元素如何显示的问题.   取值:none(隐藏).block(以块元素显示).inline(以行内元素显示)   block:可以实现将行内元素转成块元素.   ...

  5. CSS中的overflow属性

    导读:overflow属性一般用来隐藏超过div范围的元素,包括不隐藏(visible),直接隐藏(hidden),用滚动条隐藏(scroll),自动(aotu)这四个属性.当然overflow的用法 ...

  6. overflow属性

    css属性overflow属性定义溢出元素内容区的内容会如何处理.如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制. 参数是scroll时候,必会出现滚动条. 参数是auto时候,子 ...

  7. CSS overflow 属性

     值 描述 visible 默认值.内容不会被修剪,会呈现在元素框之外. hidden 内容会被修剪,并且其余内容是不可见的. scroll 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容. ...

  8. 转:CSS Overflow 属性

    原文:CSS Overflow 属性译自:The CSS Overflow Property版权所有,转载请注明出处,多谢!! 根据CSS的盒模型概念,页面中的每个元素,都是一个矩形的盒子.这些盒子的 ...

  9. overflow属性及其在ios下卡顿问题解决

    overflow属性:http://www.w3school.com.cn/cssref/pr_pos_overflow.asp overflow:scroll/auto;在手机页面滑动不流畅问题: ...

  10. CSS3对于盒中容纳不下的内容的显示——overflow属性

    overflow属性 1.如果将overflow属性值设定为hidden,则超出容纳范围的文字将被隐藏起来. div{ overflow:hidden; } 2.如果将overflow属性值设定为sc ...

随机推荐

  1. sqlmap的详细使用

    各项参数讲的太仔细了,对于只会几个参数的我来说,太受用了. 先mark下 http://drops.wooyun.org/tips/143 http://drops.wooyun.org/tips/4 ...

  2. C语言入门(16)——C语言的数组

    和结构体类似,数组也是一种复合数据类型,它由一系列相同类型的元素组成.C语言支持一维数组和多维数组.如果一个数组的所有元素都不是数组,那么该数组称为一维数组. 一维数组的定义方式 在C语言中使用数组必 ...

  3. ajax跨域请求的方案

    $.get("@Hosts.Default.Www/api/XXXXX/Getxxx/"+@Model.UserId, function(data) { $("#tota ...

  4. 适合入门自学服装裁剪滴书(更新ing)

    [♣]适合入门自学服装裁剪滴书(更新ing) [♣]适合入门自学服装裁剪滴书(更新ing) 适合入门自学服装裁剪滴书(更新ing) 来自: 裁缝阿普(不为良匠,便为良医.) 2014-04-06 23 ...

  5. $(window).width() is not a function

    昨天在帮同事调试JS的时候,FF报错了,$(window).width() is not a function.我以前也是这么用的,都没问题,为什么现在就报错了呢? 这是因为jQuery用" ...

  6. mongodb 2.6.6 在window10下的安装

    首先感谢波仔的知道,其次感叹下WIN10的牛叉,兼容性还不错. 首先,下载mongodb 2.6.6 安装包,可惜,官网太慢,还得注册.不过还好,我是个好人:http://pan.baidu.com/ ...

  7. SharePoint 2013 强制安装解决方案

    Add-SPSolution Install-SPSolution -Identity DemonstrationZone.wsp -GACDeployment -CompatibilityLevel ...

  8. Excel 提供数据 更新或者插入数据 通过函数 自动生成SQL语句

    excel 更新数据 ="UPDATE dbo.yt_vehicleExtensionBase SET yt_purchase_date='"&B2&"' ...

  9. @synthesize 与@dynamic区别

    @synthesize 除非开发人员已经做了,否则由编译器自动生成getter/setter方法. 当开发人员自定义存或取方法时,自定义会屏蔽自动生成该方法. @dynamic 告诉编译器,不自动生成 ...

  10. C# datetimePicker控件格式设置

    //必须先设置Format属性为Custom,然后才能自定义格式 this.dtPicker.Format = DateTimePickerFormat.Custom; this.dtPicker.C ...