码迷,mamicode.com
首页 > Web开发 > 详细

CSS-基本视觉格式化

时间:2016-08-17 15:25:40      阅读:472      评论:0      收藏:0      [点我收藏+]

标签:

块元素

基本框

  css假定每个元素都会生成一个或多个矩形框,这称为元素匡。各元素框中心有一个内容区,周围有可选的内边距,边框,外边距。内容的背景也会应用到内边距,外边距通常是透明的,从中可以看到父元素的背景,内边距不能是负值,外边距可以。

  边框如果没有设置颜色,那么将取前景色,宽度绝对不能为负

包含块

  每个元素都相对于包含块摆放,包含块由最近的块级祖先框、表单元格或行内块祖先框的内容边界构成。

水平格式化

  水平格式化的7大属性:margin-left,border-left,padding-left,width,padding-right,border-right,margin-right.这7个属性的值加在一起必须是元素包含块的宽度,这往往是块元素的父元素width。在这7个属性中,只有width、以及左右外边距这3个属性可以设置为auto。

  1、如果设置width,margin-left或margin-right中的某个值为auto,而余下两个属性指定为特定的值,那么设置为auto的属性会确定所需要的长度,从而使元素框的宽度等于父元素的width。加入7个属性的和必须等于400px,没有设置内边距和边框,右外边距和width设置为100,左外边距设置为auto。那么左外边距的宽度将是200;

  2、如果这3个属性都设置为非auto的某个值,此时总会把margin-right强制为auto,如果width和外边距都是100px,用户代理将把右外边距重置为auto,右外边距的实际宽度则会根据auto值来设置。

  3、如果两个外边距设置为auto,它们会设置为相等的长度;如果width和一个外边距为auto,设置为auto的外边距会减为0;width会设置为所需的值。

  4、如果都为auto,则外边距都为0,width会尽可能宽

边框不能是百分比。

替换元素

  非替换元素的所有规则同样适用于替换元素,只有一个例外,如果width为auto,元素的宽度则是内容的固有宽度。

垂直格式化

  在css中,可以对任何块级元素设置显示高度。

  如果高度小于显示内容所需的高度,浏览器会向元素增加一个滚动条。

垂直属性

  垂直格式化也有7个相关的属性,margin-top、border-top、padding-top、height、padding-bottom、border-bottom、margin-bottom。

  这7个属性只有3个可以设置为auto,元素内容的height以及上下外边距。上下内边距和边框都必须设置为特定的值。

  如果一个块元素的上下外边距都是auto,它会自动计算为0.

行内元素

CSS-基本视觉格式化

标签:

原文地址:http://www.cnblogs.com/todayCCCC/p/5780030.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!