css3新属性 附上盒子居中例子

边框

border-color 属性 boder-image 属性 border-radius 属性 box-shadow 属性

背景

background-origin 属性和 background-clip 属性 background-size 属性 多重背景

颜色

HSL 颜色值 HSLA 颜色值 opacity 属性 RGBA 颜色值

文字效果

text-shadow 属性 text-overflow 属性 word-wrap 属性

用户界面

box-sizing 属性 resize 属性 outline 属性 nav-top、nav-right、nav-bottom、nav-left 属性

选择器

属性(attribute)选择器

基本盒模型

overflow-x 属性和 overflow-y 属性

生成的内容

content 属性

其它模块

media queries 模块

multi-column layout 模块 Web 字体模块

Speech 模块

居中 内部div 设置宽高属性

第一种特性用到 transfrom

<style> .parent{position: relative;height: 600px;width: 600px;border: 1px solid #00d4b4} .son{position:absolute;top: 50%;left: 50%;transform: translateX(-50%) translateY(-50%);border: 1px solid;width: 200px;height: 200px} </style>

<div class="parent"> <div class="son"></div> </div>

第二种居中 子div的内容不管多少都是垂直左右居中的

.sec-parent{display: table-cell;border: 1px solid;height: 600px;width: 600px;vertical-align: middle;text-align: center} .sec-parent .son{vertical-align: middle;border: 1px solid;margin: 0px 20px}

<div class="sec-parent"> <div class="son"> hello world hello worldhello worldhello worldhello worldhello worldhello worldhello world </div> </div>