CSS学习之背景和列表相关属性

背景属性

设置背景颜色

background-color 属性

CSS 背景属性用于定义HTML元素的背景。

代码示例

background-color: rgba(0, 0, 0, 0.5);
/* 0.5为透明度 */

image

设置背景图像

background-image 属性

CSS background-image 属性用于为一个元素设置一个或者多个背景图像。

代码示例

background-image: url("图片路径或者链接");

image

设置背景图像平铺方式

background-repeat 属性

background-repeat CSS 属性定义背景图像的重复方式。背景图像可以沿着水平轴,垂直轴,两个轴重复,或者根本不重复。

代码示例

background-repeat: repeat;

image

设置背景图像是否固定

background-attachment 属性

background-attachment CSS 属性决定背景图像的位置是在视口内固定,或者随着包含它的区块滚动。

代码示例

background-attachment:fixed;

image

设置背景图像位置

background-position 属性

background-position CSS 属性为每一个背景图片设置初始位置。这个位置是相对于由 background-origin 定义的位置图层的。

代码示例

background-position:center;

image

设置背景图像大小

background-size

background-size 设置背景图片大小。图片可以保有其原有的尺寸,或者拉伸到新的尺寸,或者在保持其原有比例的同时缩放到元素的可用空间的尺寸。

代码示例

background-size:auto;

image

设置背景图像的起点

background-origin 属性

background-origin 规定了指定背景图片background-origin 属性的原点位置的背景相对区域。

代码示例

background-origin:content-box;

image

列表属性

设置列表项标记的类型

list-style-type

CSS 属性 list-style-type 可以设置列表元素的 marker(比如圆点、符号、或者自定义计数器样式)。

代码示例

list-style-type:lower-alpha;

image

使用图像替换列表项标记

list-style-image

list-style-image 属性用来指定一个能用来作为列表元素标记的图片。

代码示例

list-style-image:url('图片路径或者图片链接');

image

 

© 版权声明
THE END
喜欢就支持一下吧
点赞14 分享