第11章CSS的属性.pptVIP

第11章 CSS的属性 11.1.1 字体属性font-family 11.1.2 字体风格font-style 11.1.3 字体变形font-variant 11.1.4 字体加粗font-weight 11.1.5 字号的控制font-size 11.1.6 文字的更改text-transform 11.1.7 文字修饰text-decoration 11.1.8 字体属性font 11.2.1 设置字间距及字母间距 11.2.2 设置行距 11.2.3 文字对齐 11.2.4 首行缩进属性 11.3.1 颜色属性 11.3.2 背景颜色属性 11.3.3 背景图像属性 11.3.4 背景图片重复属性 11.3.5 固定背景图片属性 11.3.6 背景图片的位置属性 11.3.7 背景 11.4.1 网页链接属性anchor 11.4.2 设置滚动条属性scrollbar 11.4.3 光标属性的设置cursor 11.4.4 边框的设置 11.5.1 CSS定位属性 11.5.2 CSS定位方法 每个元素在页面中都有一个自然位置。相对于这个原始位置移动元素称为“相对定位”。周围的元素根本不受影响。 11.7 偏移自然流中的元素 提示： 1.相对定位中的“相对”指的是相对于元素的原始位置，而不是相对于周围的元素。无法让一个元素相对于周围的元素进行移动，却能相对于元素原来的位置进行移动。 2.其他元素不会受到偏移的影响，它们仍然按照这个元素原来的包含框依次排列，因此可能会与这个元素现在的位置发生重叠。 3.如果不同时使用position属性，偏移就不起作用。 4.定位不是继承的。 偏移自然流中的元素：position:relative;top|right|bottom|left:v v是希望元素从它的自然位置偏移的距离，可以表示为绝对值或相对值或者百分数。 .date { position:relative; top:-1.1em;} .description {position:relative; left:1em; margin-bottom:0.2em} 绝对定位（ absolute ）：绝对定位使元素与文档流无关，不占据文档空间。普通流中的元素会表现的好像绝对定位的元素并不存在一样。绝对定位的元素的位置相对于最近的已定位的祖先元素。若元素没有已定位的父元素，如果不存在这样的祖先对象，则依据body对象 此时对象不具有外边距( margin )，但仍有内边距( padding )和边框( border ) 11.8 对元素进行绝对定位 提示： 1. 已定位的祖先元素（包含块）:是指具有position:absolute|relative|fixed的祖先元素，（无论是父对象还是祖父对象，或者再高的辈分） 2. TRBL属性（TOP、RIGHT、BOTTOM、LEFT）只有当设定了position属性才有效。 3.规则： ①如果父级没有设定position属性，那么当前的absolute则结合TRBL属性以浏览器左上角为原始点进行定位 ②如果父级设定position属性，那么当前的absolute则结合TRBL属性以父级（最近）的左上角为原始点进行定位。 11.8 对元素进行绝对定位 提示： 1.使用百分数或em创建能够适应访问者浏览器设置的流式布局。 2.因为绝对定位的元素脱离了文档流，它们可能会相互重叠或与其他元素重叠。（这不一定是坏事儿） 3.如果没有为绝对定位的元素指定偏移量，这个元素就出现在它的自然位置上，但是不会影响后续的元素流。 对元素进行绝对定位：position:absolute;top|right|bottom|left:v .photo_text {position:relative} .photo {position:absolute;left:-112px;top:3px} 一般应用：在一个相对定位的元素里面放置 一个绝对定位的元素 上一页 下一页 目 录 结 束 本 节 说明： ⑴ position属性用于对象的定位，它的参数值有absolute和relative两种。 其中absolute表示绝对定位，绝对定位能精确设定对象在网页中的独立位置，而不考虑网页中其他对象的定位设置，在绝对定位中对象的位置是相对于浏览器窗口而言的。 而relative表示相对定位。它所定位的对象的位置是相对于不使用定位设置时该对象在文档中所分配的位置。即，相对定位的关键在于被定位的对象的位置是相对于它通