首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

CSS统制文本显示长度

2012-06-26 
CSS控制文本显示长度CSS控制文本长度比用c和fn标签来控制文本长度好用多了,特此记录下。此处要用到的语法为

CSS控制文本显示长度
CSS控制文本长度比用c和fn标签来控制文本长度好用多了,特此记录下。

此处要用到的语法为CSS中的:
1、text-overflow:clip | ellipsis

  clip:不显示省略标记(...),而是简单的裁切;
  ellipsis:当对象内文本溢出时显示省略标记(...)
 
  text-overflow:ellipsis

2、white-space:normal | pre | nowrap| pre-wrap | pre-line | inherit
  normal默认。空白会被浏览器忽略。
  pre空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
  nowrap文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。
  pre-wrap保留空白符序列,但是正常地进行换行。
  pre-line合并空白符序列,但是保留换行符。
  inherit规定应该从父元素继承 white-space 属性的值

  强制文本在一行内显示(white-space:nowrap)

3、overflow : visible | auto | hidden | scroll
  溢出内容为隐藏(overflow:hidden)


<html> <head>  <style type="text/css">   .text-hide{      text-overflow:ellipsis;      white-space:nowrap;      overflow:hidden;      width:200px;   }  </style> </head> <body>  <div class="text-hide">    Dota官方全称LogoDota是Defense of the Ancients的简称,可以译作守护古树、守护遗迹、远古遗迹守卫, 是指基于魔兽争霸3:冰封王座(由暴雪娱乐公司出品)的多人即时对战自定义地图,可支持10个人同时连线游戏。DotA是目前唯一被暴雪娱乐公司官方认可的魔兽争霸的RPG地图。Allstars系列现更新作者为美国人IceFrog。    截至日前,DotA Allstars官方最新版本为6.74c,AI版本为DOTA6.74c AI简体中文版。  </div> </body></html>

热点排行