如图:

1.自动换行

<div style="widht:100%;height:100%;word-wrap: break-word"></div>

2.限制宽高度

<div style="widht:100px;height:100px;overflow:hidden"></div>

(注意:如果div放在li中还需要加上display:inline-block属性)

CSS------当内容超出div宽度后自动换行的更多相关文章

  1. CSS------当内容超出div宽度后自动换行和限制文字不超出div宽度和高度

    如图: 1.自动换行 </div> 2.限制宽高度 </div> (注意:如果div放在li中还需要加上display:inline-block属性)

  2. CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行

    CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行. 一般的文字截断(适用于内联与块): .text-overflow {     display:block;/*内联对象需加*/     ...

  3. Html内容超出标记宽度后自动隐藏

    我们在显示长文本时,往往需要去在C#端去截取字符,但这绝对不是一个好方面,因为我们的长文本往往都是代HTML标记的,你一个载不好,就会出现乱码问题(出现半个HTML标记),而比较好的作法就是通过CSS ...

  4. css-div中文字过多(内容超出div宽度)后自动换行

    故事是这样的: 买家秀:(refuse)                                                                                ...

  5. CSS实现超出DIV宽度文字自动隐藏并显示省略号

    当文字超出DIV宽度时,超出的文字部分省略,并用显示省略号代替,css代码如下: div.ellipsis { padding-left: 5px; text-align: left; text-ov ...

  6. 当div元素内的内容超出其宽度时,自动隐藏超出的内容

    word-break:keep-all;/* 不换行 */ white-space:nowrap;/* 不换行 */ overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */ te ...

  7. css设置内容超出后显示省略号

    1.使用overflow: hidden把超出的内容进行隐藏: 2.然后使用white-space: nowrap设置内容不换行: 3.最后使用text-overflow: ellipsis设置超出内 ...

  8. CSS- 文本超出指定宽度后隐藏并显示为省略号

    一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加*/ width:25em; word-break:keep-all;/* 不换行 * ...

  9. CSS控制文本超出指定宽度显示省略号和文本不换行

    一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加 */ width:31em;/* 何问起 hovertree.com */ word ...

随机推荐

  1. python file 文件读写

    python 文本对象 继承自C的stdio包 打开 可以用内置的open()函数创建 with open("hello.txt") as f: for line in f: pr ...

  2. 十天冲刺---Day6

    站立式会议 站立式会议内容总结: 燃尽图 照片 一个队友回家有事,一个队友参加校运会比赛,只剩下两个人. 失去了UI是噩梦

  3. Android-动画简介

    Android中动画分为3种: ween Animation:通过对场景里的对象不断做图像变换(平移.缩放.旋转)产生动画效果,即是一种渐变动画: 也称View动画:也叫渐变动画,针对View的动画, ...

  4. Shell命令_文件系统常用命令df、du

    一.df(文件系统查看命令) [root@localhost ~]# df [选项] [挂载点] 选项: -a 显示所有的文件系统信息,包括特殊文件系统,如 /proc. /sysfs -h 使用习惯 ...

  5. 同 一个页面,不同请求路径,如何根据实际场景写JS

    场景:使用同一个“添加群成员”的页面来操作 建群页面:建群成功后,返回查看群成员页面.在建群过程中直接添加群成员并返回一个群名称的参数. 添加群成员页面:在巳有群内添加群成员,添加成功后,返回查看群成 ...

  6. Chrome DevTools good good study day day up

    Chrome DevTools 官方页面 https://developer.chrome.com/devtools

  7. Java 日期比较以及得到前后一天

    /** * 比较两个指定时间,结果为0 表示相同,< 0 则表示第一个时间早于第二个时间 * @param firstDay * @param secondDay * @return */ pu ...

  8. [转]JVM调优总结:一些概念

    JVM调优总结:一些概念 原文出处: pengjiaheng 数据类型 Java虚拟机中,数据类型可以分为两类:基本类型和引用类型.基本类型的变量保存原始值,即:他代表的值就是数值本身:而引用类型的变 ...

  9. Java+FlexPaper+swfTools仿百度文库文档在线预览系统设计与实现

    笔者最近在给客户开发文档管理系统时,客户要求上传到管理系统的文档(包括ppt,word,excel,txt)只能预览不允许下载.笔者想到了百度文库和豆丁网,百度文库和豆丁网的在线预览都是利用flash ...

  10. js-JavaScript高级程序设计学习笔记11

    依然第十四章 1.选择部分文本:使用setSelectionRange()方法,两个参数为第一个字符的索引和最后一个字符之后的索引,类似于substring()方法. 2.IE8及更早版本使用范围选择 ...