css前端易忘内容收录

1.滚动滚动时,想让某一个区域保持位置不变,不随着滚动条的滚动发生变化,只须要给该区域追加position:fixed css

2.须要某个块级区域自动居中的话,只须要将该区域的宽度设置一下,而后添加 margin-left:auto,margin-right:auto;不可追加float属性。或者直接将该区域放在<center>标签中。 html

注:html5不支持center,可是主流浏览器都支持html4.01和以前的标准,所以center仍是能够在适当的时机使用的,一样放在center标签中的元素同样不可追加float属性。 html5

3.对于不一样的浏览器,css样式每每是有区别,能够用css hack来处理 web

复制代码
#demo { background-color:blue; /*firefox*/ background-color:red\9; /*all ie*/ background-color:yellow\0; /*ie8*/ +background-color:pink; /*ie7*/ _background-color:orange; /*ie6*/ } :root #test { background-color:purple\9; }  /*ie9*/ @media all and (min-width:0px){ #test {background-color:black\0;} }  /*opera*/ @media screen and (-webkit-min-device-pixel-ratio:0){ #test {background-color:gray;} }  /*chrome and safari*/
/*记住以上css hack 便可处理大部分的css不兼容的问题*/ /*最好不要改变样式的顺序*/ /* 另外还有一些样式能够被多中浏览器识别 */ 
#demo {
  *background-color:blue; /*ie七、ie6*/ }
复制代码

4.important关键字具备很高的优先级,同时important关键字被很几乎全部浏览器支持(ie6也部分支持),所以能够在界面设计过程当中适当的使用 !important可以省去不少麻烦。 chrome

5.某些浏览器默认状况下给整个窗体加上了滚动条,好比ie7,要想去掉滚动条,只须要加上 浏览器

html, body { overflow: hidden;/*前提是不要滚动条*/ }

 6.想让div固定某一个宽度,高度随浏览器自动变化,能够设置 spa

.div { width: 120px; height: 100%; /*高度自动变化*/ position: absolute;/*这个属性不可少*/ }

7.想让文字超长后显示省略号 firefox

复制代码
.testTD { float:left;/*这个属性不可少;不然会将td的宽度撑开*/ width:300px; /*下面这两句是实现省略号的.上边的两句也不可少 */ overflow:hidden; text-overflow:ellipsis;       
}
相关文章
相关标签/搜索