HTML中的标签

清楚浮动

.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;

你可能感兴趣的:(HTML中的标签)