1、剪切:
clip:rect(a,b,c,d);
a参数:从顶部开始剪切,多少参数表示腰间切多少;
b参数:从右边开始剪切,用减法来计算要剪去的多少;(最大的宽度-b参数 = 剪去的参数)
c参数:从下边开始剪切,用减法来计算要剪去的多少;(最大的高度度-c参数 = 剪去的参数)
d参数:从顶部开始剪切,多少参数表示腰间切多少;
2、fixed:
因为fixed的固定方式是基于html的屏幕采集的尺寸来定位的,所以通过fixed定位的元素可以取到屏幕的高度和宽度;
都是适应屏幕的
3、顶部菜单固定:
应为固定后就脱离正常文档流,会把下面的内容挡住;所以可以为父元素设置padding-top:的值为头部菜单的高度;
4、自适应宽度和高度:
在写样式的时候有时候为了使页面能够自适应浏览器的高度和宽度,可以使用position:absolute;、
然后设置top、bottom、right、left的距离为任意值,中间的位置即为当前所需要的宽度和高度,并且会自适应父级元素的宽度和高度;
并且因为没有设置宽度和高度所以在使用margin移动位置的时候会改变宽度和高度;
5、css3:
calc是英文单词calculate(计算)的缩写,是css3的一个新增的功能,
你可以使用calc()给元素的border、margin、pading、font-size和width等属性设置动态值;
例:calc(100%/3-5px);仅是一种可以计算尺寸的方式;
6、css3:
box-sizing: 默认值:center-box;就是现有的样式;
值:border-box;就是在现有的尺寸改变padding 或是border ;
不会在改变border或padding样式的时候改变现有的尺寸;
7、css3、
orientation:portrait | landscape;
portrait:指定输出设备中的页面可见区域高度大于或等于宽度;
landscape:除portrait值情况外,都是landscape
8、css:
white-space:nowrap;文字不换行,直到遇到br
text-overflow:ellipsis;超出部分以 ...显示;
// -o-text-overflow:ellipsis;在o下支持这个效果;
overflow:hidden; 要对超出部分做隐藏;
}
9、 -webkit-text-size-adjust: 100%;ios下横屏字体适应