CH04-网页布局之Div+Css概览.ppt

* 6.CSS 字体属性 * 4.2.4 CSS 链接 能够以不同的方法为链接设置样式。能够设置链接样式的 CSS 属性有很多种（例如 color, font-family, background 等等）。链接的特殊性在于能够根据它们所处的状态来设置它们的样式。 * 链接的四种状态： a:link -设置a对象在未被访问前（未点击过和鼠标未经过）的样式表属性。也就是html a锚文本标签的内容初始样式。 a:visited -设置a对象在其链接地址已被访问过时的样式表属性。也就是html a超链接文本被点击访问过后的CSS样式效果。 a:hover -设置对象在其鼠标悬停时的样式表属性，也就是鼠标刚刚经过a标签并停留在A链接上时样式。 a:active -设置A对象在被用户激活（在鼠标点击与释放之间发生的事件）时的样式表属性。也就是鼠标左键点击html A链接对象与释放鼠标右键之间很短暂的样式效果。 * 当为链接的不同状态设置样式时，请按照以下次序规则： a:hover 必须位于 a:link 和 a:visited 之后； a:active 必须位于 a:hover 之后。 * 文本修饰。text-decoration 属性大多用于去掉链接中的下划线： * 背景色。background-color 属性规定链接的背景色： * 4.2.5 CSS 列表 CSS 列表属性允许放置、改变列表项标志，或者将图像作为列表项标志。从某种意义上讲，不是描述性的文本的任何内容都可以认为是列表。 * 1.列表类型 要影响列表的样式，最简单（同时支持最充分）的办法就是改变其标志类型。可以使用属性 list-style-type： * 2.列表项图像 有时，常规的标志是不够的。你可能想对各标志使用一个图像，这可以利用 list-style-image 属性做到： * 3.列表标志位置 CSS2.1 可以确定标志出现在列表项内容之外还是内容内部。这是利用 list-style-position 完成的。 * 4.简写列表样式 为简单起见，可以将以上 3 个列表样式属性合并为一个方便的属性：list-style，就像这样： * 4.2.6 CSS 表格 CSS表格属性允许控制表格的外观及利用表格布局。border-collapse属性设置是否把表格边框合并为单一的边框。示例如下： 两种属性设置效果对比如下： * caption-side属性设置表格标题(caption)的位置。该属性可能的取值： ? top 默认值，标题在表格的上边 ? right 标题在表格的右边 ? bottom 标题在表格的下边 ? left 标题在表格的左边 * border-spacing属性用于设置单元格边框的距离，该设置仅在border-collapse属性为separate有效，例如： empty-cells属性设置是否显示内容空单元格（边框），该设置仅在border-collapse属性为separate有效。 * * background-attachment 属性的默认值是 scroll，也就是说，在默认的情况下，背景会随文档滚动。 6.CSS 背景属性 * 4.2.2 CSS 文本 CSS 文本属性可定义文本的外观。通过文本属性，您可以改变文本的颜色、字符间距，对齐文本，装饰文本，对文本进行缩进，等等。 * 1.缩进文本 把 Web 页面上的段落的第一行缩进，这是一种最常用的文本格式化效果。 CSS 提供了 text-indent 属性，该属性可以方便地实现文本缩进。通过使用 text-indent 属性，所有元素的第一行都可以缩进一个给定的长度，甚至该长度可以是负值。这个属性最常见的用途是将段落的首行缩进，下面的规则会使所有段落的首行缩进 5 em： * 一般来说，可以为所有块级元素应用 text-indent，但无法将该属性应用于行内元素，图像之类的替换元素上也无法应用 text-indent 属性。不过，如果一个块级元素（比如段落）的首行中有一个图像，它会随该行的其余文本移动。 使用负值。text-indent 还可以设置为负值。利用这种技术，可以实现很多有趣的效果，比如“悬挂缩进”，即第一行悬挂在元素中余下部分的左边： * 不过在为 text-indent 设置负值时要当心，如果对一个段落设置了负值，那么首行的某些文本可能会超出浏览器窗口的左边界。为了避免出现这种显示问题，建议针对负缩进再设置一个外边距或一些内边距： * 使用百分比值。text-indent 可以使用所有长度单位，包括百分比值。 百分数要相对于缩进元素父元素的宽度。换句话说，如果将缩进值设置为 20%，所影响元素的第一行会缩进其父元素宽度的 20%。 在下例中，缩进