《CSS权威指南》第3版 续

10 浮动和定位

1)浮动:

Float: left | right | none | inherit; (会脱离文档流)

包含块:浮动元素的包含块是其最近的块级祖先元素。

此外,浮动元素会生成一个块级框,而不论这个元素本身是什么。

Clearleft | right | both | none | inherit;


2)定位:

通过position属性,可以选择4种不同类型的定位

position: static | relative | absolute | fixed;


内容溢出:

Overflow: visible | hidden | scroll | auto | inherit;


元素可见性:

Visibility: visible | hidden | collapse | inherit;


11 表布局

table           {display: table;}

tr           {display: table-row;}

thead           {display: table-header-group;}

tbody           {display: table-row-group;}

tfoot           {display: table-footer-group;}

col           {display: table-column;}

colgroup           {display: table-column-group;}

td,th           {display: table-cell;}

Caption           {display: table-cation;}


边框:

Border-collapse: separate(分隔) | collapse(合并) | inherit;

边框间隔:border-spacing;



12 列表与生成内容


列表类型:list-style-type

列表图像:list-style-image

列表标志位置:list-style-position

简写列表样式:list-style: url(aa.gif) square inside;


生成内容:

CSS2CSS2.1包含一个称为生成内容的新特性,这是指由浏览器创建的内容,而不是由标志或内容来表示。

为了向文档中插入生成内容,可以使用:before:after元素。

指定内容:content属性。

生成内容在元素框内。


13 用户界面样式

系统字体和系统颜色

光标:cursor

轮廓:类似于边框,但不影响文档流。轮廓样式outline-style、轮廓宽度outline-width


14 非屏幕媒体

设计特定于媒体的样式表:

media属性、@media


分页媒体:

css术语中,分页媒体是把文档表示处理为一系列离散“页面”的媒体。

打印样式、投影样式、声音样式


附录A 属性参考

Background-attachment:这个属性定义了文档滚动时背景图像是否随着元素滚动;

Max-height: 应用于除了行内非替换元素和表元素之外的所有其他元素;

Text-align:这个属性通过指定行框与哪个点对齐,从而设置块级元素内文本的水平对齐方式,应用于块级元素;

Vertical-align:这个属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐,应用于行内元素和表单元格;

White-space:这个属性声明建立布局过程中如何处理元素中的空白符。

width:应用于块级和替换元素;

Border-collapse:这个属性定义了表中建立边框布局时使用的布局模型;


附录B 选择器、伪类和伪元素参考

:active(伪类,应用于被激活的元素)

:after(伪元素,允许创作人员在元素内容的最后插入生成内容。默认地,这个伪元素是行内元素)

:before(伪元素)

:first-child(伪类,只有当元素是另一个元素的第一个子元素时才能匹配)

:first-letter(伪元素,指定一个元素第一个字母的样式)

:first-line(伪元素,设置元素中第一行文本的样式)

:focus(伪类)

:hover(伪类)

:visited(伪类)


附录C 示例HTML4样式表












评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值