用CSS防止HTML页面输入字符过多撑大布局

原创 2007年09月20日 18:10:00

 
table-layout
语法:
table-layout : auto | fixed 取值:
auto  : 默认值。默认的自动算法。布局将基于各单元格的内容。表格在每一单元格内所有内容读取计算之后才会显示出来
fixed  : 固定布局的算法。在这种算法中,表格和列的宽度取决于 col 对象的宽度总和,假如没有指定,则会取决于第一行每个单元格的宽度。假如表格没有指定宽度( width )属性,则表格被呈递的默认宽度为 100% 。

说明:
设置或检索表格的布局算法。
你可以通过此属性改善表格呈递性能。此属性导致IE以一次一行的方式呈递表格内容从而提供给信息用户更快的速度。此属性依据此下顺序使用其中一种方式布置表格栏宽度:

使用 col 或 colGroup 对象的宽度( width )属性信息。

使用表格第一行内的单元格的宽度( width )信息。

依据表格列数等分表格宽度。而不考虑表格内容的实际宽度。
假如单元格的内容超过了列宽度,内容将会被换行。假如无法换行,则内容会被裁切。假如此属性被设置为 fixed ,则 overflow 能够被用于控制处理溢出单元格( td )宽度的内容。假如表格行高度被指定了,那么换行的内容如果超出了指定表格行高度也会在纵向上被裁切。
设置此属性值为 fixed ,有助于提高表格性能。对于长表格效果尤其显著。
设置表格行高可以进一步提高呈递速度,浏览器不需要检测行内每一个单元格内容去确定行高就可以开始解析以及呈递。
此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
对应的脚本特性为 tableLayout 。
示例:
table { table-layout: fixed; }

word-wrap
语法:
word-wrap : normal | break-word
取值:
normal  : 默认值。允许内容顶开指定的容器边界
break-word  : 内容将在边界内换行。如果需要,词内换行( word-break )也将发生

说明:
设置或检索当当前行超过指定容器的边界时是否断开转行。
此属性仅作用于有布局的对象,如块对象。内联要素要使用该属性,必须先设定对象的 height 或 width 属性,或者设定 position 属性为 absolute ,或者设定 display 属性为 block 。
此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
对应的脚本特性为 wordWrap 。
示例:
div { word-wrap: break-word; word-break: break-all; }
 

 

 

 

 



<style type="text/css">
table 
{...}{ 
    table-layout
: fixed;
    word-wrap
:break-word;
          
}

div 
{...}{ 
    word-wrap
:break-word;
     
}

</style> 

WEB前端-HTML-CSS-后台管理页面布局小例

作为一个后台管理页面,不必太过复杂,一般只需要三部分: 1、上层标签块; 2、左侧菜单块; 3、中部内容显示块;今天简要给大家分享一个布局中的一个小case; 需求:要求上层标签块、左侧菜单快...
  • qq_34409701
  • qq_34409701
  • 2016年08月14日 23:45
  • 4823

HTML与CSS布局技巧总结

很多人对CSS的布局有困惑,实际的应用场景中由于布局种类多难以选择。今天我花些时间总结下自己对CSS布局的理解,分析下了解各种布局的优劣,同时希望能分享给初入前端的朋友们一些在布局上的经验,如果有那些...
  • bingkingboy
  • bingkingboy
  • 2016年04月11日 00:29
  • 14726

HTML&CSS三列布局

1.利用margin值为负数 左右宽度固定中间自适应 测试页 body{ margin: 0; padding: 0; } .main{ back...
  • u011121046
  • u011121046
  • 2016年07月06日 21:51
  • 2183

HTML CSS + DIV实现整体布局

什么是 HTML? HTML 是用来描述网页的一种语言。 HTML 指的是超文本标记语言 (Hyper Text Markup Language) HTML 不是一种编程语言,而是一种标记语言 ...
  • sjpljr
  • sjpljr
  • 2017年03月28日 17:13
  • 1363

Html+Css_相对于父div进行相对布局

对 父div 进行相对布局需要用到 postion 属性, 需要将父元素设置为relative, 并将子元素设置为absolute,此时不管进行放大缩小排版不会混乱 position属性请参见W3s...
  • u010003835
  • u010003835
  • 2015年11月01日 21:12
  • 5860

一小时搞定DIV+CSS布局-固定页面开度布局

本文讲解使用DIV+CSS布局最基本的内容,读完本文你讲会使用DIV+CSS进行简单的页面布局。 转载请标明:http://www.kwstu.com/ArticleView/divcss_20...
  • CrackLibby
  • CrackLibby
  • 2016年04月15日 17:36
  • 1563

html页面框架布局

1:主页面 html> html lang="en"> head> meta charset="UTF-8"> title>html框架title> head> frameset...
  • pangqiandou
  • pangqiandou
  • 2017年07月11日 17:22
  • 2249

CSS模块化基本思想

模块化的基本概念1.什么是模块模块化是指解决一个复杂问题时自顶向下逐层把系统划分成若干模块的过程。 模块化用来分割,组织和打包软件。每个模块完成一个特定的子功能,所有的模块按某种方式组装起来,成为一...
  • dangnian
  • dangnian
  • 2016年03月14日 17:48
  • 1139

html布局之 图标文字混排

摘要:做html布局的时候经常用到图标和文字的混排,使用的时候经常要调很长时间,今天来总结一下。...
  • mika85489
  • mika85489
  • 2016年09月12日 22:32
  • 1001

HTML5 - 简单的上下布局页面样例

1,下面是一个简单的上下布局样例: 2,代码如下 可以看到页面里使用了HTML5的语义元素:< header >、< footer >、< article >— index.html — ...
  • u014063717
  • u014063717
  • 2016年03月17日 13:13
  • 3049
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:用CSS防止HTML页面输入字符过多撑大布局
举报原因:
原因补充:

(最多只允许输入30个字)