标签:col orm 页面 定义 tab 背景图片 混合 back prope
font-family
可以把多个字体名称作为一个“回退”系统来保存。如果浏览器不支持第一个字体,则会尝试下一个。浏览器会使用它可识别的第一个值。
简单实例:
body {
font-family: "Microsoft Yahei", "微软雅黑", "Arial", sans-serif
}
如果设置成inherit
,则表示继承父元素的字体。
取值范围:
值 | 描述 |
---|---|
normal | 默认值,标准粗细 |
bord | 粗体 |
border | 更粗 |
lighter | 更细 |
100~900 | 设置具体粗细,400等同于normal,而700等同于bold |
inherit | 继承父元素字体的粗细值 |
字体大小。
p {
font-size: 14px;
}
如果设置成inherit
表示继承父元素的字体大小值。
设置内容的字体颜色。
支持三种颜色值:
p {
color: red;
}
text-align 属性规定元素中的文本的水平对齐方式。
值 | 描述 |
---|---|
left | 左边对齐 默认值 |
right | 右对齐 |
center | 居中对齐 |
justify | 两端对齐 |
规律:当行高=盒子高度时,文本会垂直居中
值 | 描述 |
---|---|
none | 默认。定义标准的文本。 |
underline | 定义文本下的一条线。 |
overline | 定义文本上的一条线。 |
line-through | 定义穿过文本下的一条线。 |
inherit | 继承父元素的text-decoration属性的值。 |
常用背景相关属性:
属性 | 描述 |
---|---|
background-color | 规定要使用的背景颜色。 |
background-image | 规定要使用的背景图像。 |
background-size | 规定背景图片的尺寸。 |
background-repeat | 规定如何重复背景图像。 |
background-attachment | 规定背景图像是否固定或者随着页面的其余部分滚动。 |
background-position | 规定背景图像的位置。 |
inherit | 规定应该从父元素继承background属性的设置。 |
background-repeat
取值范围:
值 | 描述 |
---|---|
repeat | 默认。背景图像将在垂直方向和水平方向重复。 |
repeat-x | 背景图像将在水平方向重复。 |
repeat-y | 背景图像将在垂直方向重复。 |
no-repeat | 背景图像将仅显示一次。 |
inherit | 规定应该从父元素继承background-repeat属性的设置。 |
background-attachment
取值范围:
值 | 描述 |
---|---|
scroll | 默认值。背景图像会随着页面其余部分的滚动而移动。 |
fixed | 当页面的其余部分滚动时,背景图像不会移动。 |
inherit | 规定应该从父元素继承background-attachment属性的设置。 |
background-position
取值范围:
值 | 描述 |
---|---|
top left top center top right center left center center center right bottom left bottom center bottom right |
如果只设置了一个关键词,那么第二个值就是"center"。 默认值:0% 0%。 |
x% y% | 第一个值是水平位置,第二个值是垂直位置。 左上角是 0% 0%。右下角是 100% 100%。 如果只设置了一个值,另一个值就是50%。 |
xpos ypos | 第一个值是水平位置,第二个值是垂直位置。 左上角是 0 0。单位是像素 (0px 0px) 或任何其他的 CSS 单位。 如果只设置了一个值,另一个值就是50%。 可以混合使用 % 和position 值。 |
示例:
body {
background-color: red;
backgraound-image: url(xx.png);
background-size: 300px 300px;
background-repeat: no-repeat;
background-position: center
}
简写:
body {
background: red url(xx.png) no-repeat fixed center/300px 300px;
}
标签:col orm 页面 定义 tab 背景图片 混合 back prope
原文地址:https://www.cnblogs.com/venicid/p/9125459.html