清楚浮动
.clearfix:after{
content: "";
display: block;
height: 0;
visibility: hidden;
clear: both;
}
.clearfix{
zoom: 1;
}
过渡效果
transition: color 1s;
图片居中
vertical-align: middle;
投影效果
box-shadow: 1px 1px 2px #f5f5f5;
将鼠标变成手
cursor: pointer;
(自适应宽度布局)利用table-cell display的一个属性 block none inline inline-block
table-cell会把元素当作td
返回顶部的定位 position:fixed;
字体
font-size:; 设置字号 chrome的最小字号是12px
px绝对单位
em相对单位指的是倍数 相对于父元素的字号的大小
rem相对单位指的是倍数 相对于根节点html字号大小
font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
font-weight: bold bolder normal lighter 数字100~900 如果字体本身没有加粗 更细的字体,这些属性是不生效的 400normal 700bold
font-style: normal | italic | oblique;如果字体没有斜体的话,可以用oblique
color:#000; 字体颜色
line-height: 16px; 行高 可以通过设置行高等于高度让单行文字垂直居中
font: italic 600 12px/18px 宋体;
如果行高为百分数或倍数,指的相对于字号的倍数
font: italic 600 12pts/150% Courier;
font: italic 600 12pts/1.5 Courier;
文本对齐方式
text-align:center|| left|| right|| justify ; 文本居中 左对齐 右对齐 两端对齐
可以使行内元`素在块元素里对齐方式,该属性应该块元素
display: inline-block; 将对象呈递为内联对象,但是对象的内容作为块对象呈递
z-index : auto | number auto:默认值。 number: 无单位的整数值,可为负数 。
z-index值较大的元素将叠加在z-index值较小的元素之上。对于未指定此属性的定位对象,z-index 值为正数的对象会在其之上,而 z-index 值为负数的对象在其之下。
vertical-align:middle; 两个内联元素垂直居中对齐
input提示文字和边框的隐藏
value="说点什么吧!" onclick="if(value==defaultValue){value='';this.style.color='#000'}" onBlur="if(!value){value=defaultValue;this.style.color='#999'}" style="position:relative;color:#ccc;font-style: 12px;"
border: solid 0; outline: none;