css需要知道的属性知识--(2016/04/22最新更新)

27 Aug 2014

1.outline

                <input class="check" type="checkbox">
                
                .check{
                    margin: 50px;
                    /*增加轮廓线*/
                    outline: medium solid red;
                    /*形成双轮廓的效果*/
                    outline-offset:2px;
                }
            

2.resize

                <div class="test1"></div>
                
                .test1{
                    width: 100px;
                    height: 100px;
                    border: solid 1px red;
                    /*可以拉伸宽高和overflow配合使用*/
                    /*resize可选：both，none，horizontal，vertical，inherit*/
                    resize:both;
                    overflow: auto;
                }
            

3.visibility和display的区别

visibility为hidden的时候元素不可见，但是还保留空间，display为hidden的时候，空间都不保留，但是display的时候还是可以去绑定事件

4.clip

裁剪用clip： rect（0px 100px 0px 100px），这个要配合position:absolute来使用必须有单位，不能是百分比，可以为负。一般用在img上。

5.js获取和赋值内联的样式

1）如果知道具体的样式，可以直接用e.style.backgroundColor获取，需要注意的是样式表中的-在js中是减号，所以要用小驼峰的写法。

2）或者用e.style.cssText来获取。

3）或者用e.setAttribute("style","")和getAttribute()

6.link有个disabled属性，设置成true和注释了是一个效果

7.注释掉input在IE下默认的叉号

                    input[type="text"]::-ms-clear, ::-ms-reveal{
                        display: none;
                    }