zoukankan      html  css  js  c++  java
  • CSS3---8.盒模型

    1.在默认情况下,CSS设置的盒子宽度仅仅是内容区的宽度,而非盒子的宽度。同样,高度类似。真正盒子的宽度(在页面呈现出来的宽度)和高度,需要加上一些其它的属性。例如:
    a)padding + border + width = 盒子的宽度
    b)padding + border + height = 盒子的高度
    很明显,这不直观,很容易出错,造成网页中其它元素的错位。
    2. CSS3中可以通过box-sizing 来指定盒模型,即可指定为content-box、border-box,这样我们计算盒子大小的方式就发生了改变
    a)content-box:对象的实际宽度等于设置的width值和border、padding之和
    b)border-box: 对象的实际宽度就等于设置的width值,即使定义有border和padding也不会改变对象的实际宽度
    3.浏览器的兼容性:
    IE8及以上版本支持该属性,Firefox 需要加上浏览器厂商前缀-moz-,对于低版本的IOS和Android浏览器也需要加上-webkit-
    
  • 相关阅读:
    sort排序
    js数组
    json数据格式 与 for in
    js 定时器
    鼠标滚轮事件
    cookie
    POJ 2387 Til the Cows Come Home
    POJ 1459 Power Network
    HDU 5389 Zero Escape
    HDU 5387 Clock
  • 原文地址:https://www.cnblogs.com/Tobenew/p/10525781.html
Copyright © 2011-2022 走看看