一、initial
initial 关键字用于设置 CSS 属性为它的默认值。
initial 关键字可用于任何 HTML 元素上的任何 CSS 属性。
他和inherit类似,inherit是使用其父元素的对应属性。
二、border-radius 圆角边框的设置
三、使页面的高度为屏幕的高度
在css中,如下设置:
html,body{
height:100%;
}
四、background-size 控制图片如何填充元素
1、auto 默认值,图像以本尺寸显示
2、cover 等比例缩放图片,使图像至少覆盖容器,但有可能超出容器。
3、contain 等比例缩放图像,使其宽度、高度中较大者与容器横向或纵向重合。
4、长度值,如px、em
5、百分数,如100%
分析:属性值cover和contain都是等比例缩放图片的,图片中的图像不会被拉长,只会等比例变化
属性值使用长度值和百分数,会将图片的长或高拉长到设定的值,从而会影响图片中图像的显示。
五、background-origin 规定了background-position属性相对什么位置来定位
border-box 背景在border、padding、element上
padding-box 默认值,背景在padding、element上
content-box 背景在element上
六、background-clip 规定了从什么位置来裁剪背景图片
border-box 保留border、padding、element处的背景图片
padding-box 保留padding、element处的背景图片
initial 关键字用于设置 CSS 属性为它的默认值。
initial 关键字可用于任何 HTML 元素上的任何 CSS 属性。
他和inherit类似,inherit是使用其父元素的对应属性。
二、border-radius 圆角边框的设置
border-radius的属性值有8个,斜杠前是水平方向,斜杠后是垂直方向
eg: border-radius:50% 50% 0%/50% 40% 0;
三、使页面的高度为屏幕的高度
在css中,如下设置:
html,body{
height:100%;
}
四、background-size 控制图片如何填充元素
1、auto 默认值,图像以本尺寸显示
2、cover 等比例缩放图片,使图像至少覆盖容器,但有可能超出容器。
3、contain 等比例缩放图像,使其宽度、高度中较大者与容器横向或纵向重合。
4、长度值,如px、em
5、百分数,如100%
分析:属性值cover和contain都是等比例缩放图片的,图片中的图像不会被拉长,只会等比例变化
属性值使用长度值和百分数,会将图片的长或高拉长到设定的值,从而会影响图片中图像的显示。
五、background-origin 规定了background-position属性相对什么位置来定位
border-box 背景在border、padding、element上
padding-box 默认值,背景在padding、element上
content-box 背景在element上
六、background-clip 规定了从什么位置来裁剪背景图片
border-box 保留border、padding、element处的背景图片
padding-box 保留padding、element处的背景图片
content-box 只保留element处的背景图片
七、box-sizing 允许您以特定的方式定义匹配某个区域的特定元素
属性值为border-box和content-box
注意:Internet Explorer、Opera 以及 Chrome 支持 box-sizing 属性。
Firefox 支持替代的 -moz-box-sizing 属性
本文介绍了CSS中的initial关键字、border-radius属性、实现全屏高度的方法、background-size和origin/clip属性的作用及box-sizing属性的用法。
757

被折叠的 条评论
为什么被折叠?



