一些CSS的属性

一些常用的CSS的属性

• box-sizing 最主要的用法是规定容器元素的最终尺寸计算方式。
  • .div{width:100px; border:10px solid red; padding:10px; }最终宽度为100px(width)+210px(padding)+2*10px(border)=140px，你会得到一个比你预期（100px）还要更大的容器，结果就是会破坏网页布局。
  • .div{width:100px; border:10px solid red; padding:10px; box-sizing:border-box}最终宽度为100px-210px-210px =60px，你会得到一个你预期大小的盒子容器，但是只是被压缩了内容部分尺寸而已，但是对于整体布局而言益处颇多。
  • 所以要合理利用好这个属性，这个属性十分重要。
• vertical-align
  • vertical-align是用来设置行内元素对齐方式的。说白了就是display属性值为inline、inline-block、inline-table、table-cell的元素。
  • 默认情况下，图片，按钮，文字和单元格都可以用vertical-align属性
• background-image
  • CSS3 支持多背景
  • background-image: url(./images/bg_pattern.png), url(./images/linebr-x.png);
    background-position: top right, bottom right;
    background-repeat: no-repeat, repeat-x;
    background-size: 80%, none;