教学内容     HTML篇 | CSS篇 | VBScript篇 | JavaScript篇 | ASP篇 |

第十节 CSS布局

 

发布:刘声田  发布时间:2011-11-25  字体:【

一、CSS+DIV布局意义

  意义1
网页样式设计与网页内容编码完全分离,分工明确,修改方便—
意义2:
定义的样式表文件可以直接应用到其它网页中,缩短了开发周期
 

二、clear

  基本语法
clear : none | left | right | both
语法取值
none :默认值。允许两边都可以有浮动对象
left :不允许左边有浮动对象
right :不允许右边有浮动对象
both :不允许有浮动对象
使用说明
该属性的值指出了不允许有浮动对象的边。

三、float

  基本语法
float : none | left | right
语法取值
none :默认值。对象不飘浮
left :文本流向对象的右边
right : 文本流向对象的左边
使用说明
该属性的值指出了对象是否及如何浮动。请参阅 clear 属性。当该属性不等于 none 引起对象浮动时,对象将被视作块对象( block-level ),即 display 属性等于 block 。也就是说,浮动对象的 display 属性将被忽略。跟随浮动对象的对象将移动到浮动对象的位置。浮动对象会向左或向右移动直到遇到边框( border 、内补丁( padding 、外补丁( margin 或者另一个块对象( block-level )为止。在IE5+中, div 和 span 对象假如没有指定宽度会被分配默认的宽度,而在此前的浏览器版本中则必须指定宽度值才可以呈递此属性。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。对应的脚本特性为 styleFloat 。

四、overflow

  基本语法
overflow : visible | auto | hidden | scroll
语法取值
visible :默认值。不剪切内容也不添加滚动条。假如显式声明此默认值,对象将以包含对象的 window 或 frame 的尺寸裁切。并且     clip 属性设置将失效
auto :在必需时对象内容才会被裁切或显示滚动条
hidden :不显示超过对象尺寸的内容
scroll :总是显示滚动条
使用说明
检索或设置当对象的内容超过其指定高度及宽度时如何管理内容。所有对象的默认值是 visible ,除了 textarea 对象和 body 对象的默认值是 auto 。设置 textarea 对象此属性值为 hidden 将隐藏其滚动条。对于 table 来说,假如 table-layout 属性设置为 fixed ,则 td 对象支持带有默认值为 hidden 的 overflow 属性。如果设为 scroll 或者 auto ,那么超出 td 尺寸的内容将被剪切。如果设为 visible ,将导致额外的文本溢出到右边或左边(视 direction 属性设置而定)的单元格。自IE5开始,此属性在MAC平台上可用。自IE6开始,当你使用 !DOCTYPE 声明指定了 standards-compliant 模式,此属性可以应用于 html 对象。对应的脚本特性为 overflow 。
 

五、visibility

  基本语法
visibility : inherit | visible | hidden
语法取值
inherit :  默认值。继承父对象的可见性
visible :  对象可视
hidden :  对象隐藏
使用说明
设置或检索是否显示对象。与 display 属性不同,此属性为隐藏的对象保留其占据的物理空间。在IE5.0+中,当父对象不可视时子对象是能被设为可视的。而在此前的浏览器版本中,如果希望对象为可视,其父对象也必须是可视的。此属性对 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。对应的脚本特性为 visibility 。