元素之内且class属性为a的元素起作用。

 

　　子选择器用于指定目标选择器必须是某个选择器对应的元素的子元素。自选择器的语法格式如下：

 

　　子选择器与后代选择器有点相似，它们之间存在如下区别：对于后代选择器，只要目标选择器位于外部选择器对应的元素内部，即使是其“孙子元素”也可；对于子选择器，要求目标选择器必须是外部选择器对应的元素的直接子元素才行。

 

　　有些时候，我们需要让一份CSS样式对多个选择器起作用，那就可以利用并列选择器来实现了。并列选择器的语法格式如下：

 

　　对于并列选择器而言，｛｝中定义的CSS样式将会对前面列出的所有选择器匹配的元素起作用。例如下面的示例。

 

　　上面定义的样式对div元素、class属性为a的元素、id为abc的元素都起作用。

 

　　元素盒子有两部分是可见的：内容和边框。内边距是内容和边框之间的空间，外边距是边框和页面上其他元素之间的空间。

 

　　属性名描述border-Width＜/td>设置边框的宽度border-style设置边框的类型border-color设置边框的颜色border属性简写

 

　　属性的值：

 

　　没有边框？短线式边框？圆点线式边框？双线式边框？槽线式边框？有内嵌效果的边框？有外凸效果的边框？脊线边框？实线边框

 

　　内边距会在元素内容和边框之间添加空白。我们可以为元素的每个边界单独设置内边距，也可以使用padding简写属性，在一条声明中设置所有的值。

 

　　属性说明值设置顶部的内边距长度值或百分数设置右边的内边距长度值或百分数设置底部的内边距长度值或百分数设置左边的内边距长度值或百分数简写属性同上，顺序为：

 

　　外边距是元素边框和页面上围绕在它周围的所有东西之间的空白区域。围绕在它周围的东西包括其他元素和它的父元素。

 

　　属性说明值设置顶部的外边距长度值或百分数设置右边的外边距长度值或百分数设置底部的外边距长度值或百分数设置左边的外边距长度值或百分数简写属性

 

　　跟内边距属性相似，使用百分数值设置外边距时，百分数总是跟包含块的宽度相关。

 

　　外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。

 

　　下面三种基本情形会出现外边距合并：

 

　　相邻兄弟元素

 

　　相邻的两个兄弟元素的之间的外边距会合并。如：

 

　　可以发现这两个段落中间的距离，不是“上面段落的下边距”与“下面段落的上边距”的和 ，而是两者中的较大者（在此示例中为30px）。

 

　　+块级父元素与其第一个或最后一个子元素

 

　　此时这个块级父元素和其第一个子元素就会发生？上外边距合并？现象，换句话说，此时这个父元素对外展现出来的外边距将直接变成这个父元素和其第一个子元素的的较大者。

 

　　空块元素

 

　　如果存在一个空的块级元素，其 border、padding、content、height、min-height 都不存在。那么此时它的上下边距中间将没有任何阻隔，此时它的上下外边距将会合并。例如：

 

　　当有负边距存在时，合并后的外边距将是最大正边距加上最小负边距（即负边距中绝对值最大的一个）。

 

　　如两个兄弟元素，上面的元素的下边距为 20px ，下面的元素的上边距为 -20px ，那么发生外边距合并后，这两个元素的实际距离将变成 0px 。

 

　　如果放置内容的元素尺寸太小的话，浏览器默认的处理方式是内容溢出，溢出的内容会被显示。如下例所示：

 

　　我们可以使用overflow属性改变这种行为，下表列出了相关的overflow属性及值。

 

　　属性名：

 

　　设置水平方向的溢出方式？设置垂直方向的溢出方式？简写属性，只能设置一个属性，当水平方向和垂直方向上设置的值相同时，可以使用该属性。

 

　　属性值：

 

　　默认值。内容不会被修剪，会呈现在元素框之外。？内容会被修剪，溢出部分是不可见的？内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。？由浏览器决定如何显示。如果内容太多就显示滚动条，否则就不显示。

 

　　display属性提供了一种改变元素盒类型的方式，给元素应用display属性后会改变元素在页面上的显示方式。下表列出了一些display属性常用的属性值。

 

　　值说明元素会被显示成行内元素此元素将显示成块级元素元素会被显示成行内的块级元素元素既不显示，也不占据文档空间

 

　　块级元素

 

　　将display属性设置为block值会创建一个块级元素。块级元素独占一行，不允许其他元素与其同在一行。常见的块级元素有div、p等。

 

　　行内元素

 

　　将display属性设置为inline使会创建一个行内元素，行内元素会显示在同一行，不会独占一行。常见的行内元素有a、span等。

 

　　使用inline值的时候，浏览器会忽略某些属性，比如：。

 

　　行内块级元素

 

　　将display属性设置为inline-block就会创建一个同时具有行内和块级元素特征的元素。盒子整体上作为行内元素显示，也就是说会跟其他行内元素显示在同一行，但盒子内部作为块级元素显示，这样，和属性都会应用到盒子上。

 

　　隐藏元素

 

　　将属性设置为值就是告诉浏览器不要为元素创建任何类型的盒子，这时元素在页面中不显示，也不占据任何空间。

 

　　使用float属性可以创建浮动的盒子，浮动盒会将元素的左边界或者右边界移动到包含块或另一个浮动盒的边界。

 

　　属性名：

 

　　设置元素的浮动样式

 

　　属性值：

 

　　移动元素，使其左边界挨着包含块的左边界或另一个浮动元素的右边界移动元素，使其右边界挨着包含块的右边界或另一个浮动元素的左边界默认值。元素不浮动，并会显示在其在文本中出现的位置。

 

　　清除浮动

 

　　如果设置了多个浮动元素，默认情况下，它们会一个挨着一个地堆叠在一起。使用clear属性可以阻止出现这种情况。clear属性可以阻止出现这种情况。clear属性可以指定浮动元素的一个边界或者两个边界不能挨着另一个浮动元素。

 

　　属性名：设置元素的左边界、右边界或左右两个边界不允许出现浮动元素

 

　　属性值：

 

　　元素的左边界不能挨着另一个浮动元素元素的右边界不能挨着另一个浮动元素元素的左右边界都不能挨着浮动元素默认值。允许浮动元素出现在两侧