CSS 中 border: 1px solid rgba(0, 0, 0, 0.1); 是什么意思？

意思是: 设定元素的边框为 1 像素宽、实线、颜色使用 rgba 来表达。

其中，rgba 是 CSS3 中的属性。rgba 括号中前 3 个数字代表着 red green blue 三种颜色的 rgb 值（0-255），最后一个是设定这个颜色的透明度即 alpha 值。范围从 0 到 1，越接近 1，代表透明度越低。

补充：CSS3 多重背景(multiple backgrounds)

多重背景，也就是CSS2里background的属性外加origin、clip和size组成的新background的多次叠加，缩写时为用逗号隔开的每组值；用分解写法时，如果有多个背景图片，而其他属性只有一个（例如background-repeat只有一个），表明所有背景图片应用该属性值。

语法缩写如下：

background ： [background-color] | [background-image] | [background-position][/background-size] | [background-repeat] | [background-attachment] | [background-clip] | [background-origin],...

可以把上面的缩写拆解成以下形式：

background-image:url1,url2,...,urlN;
background-repeat : repeat1,repeat2,...,repeatN;
backround-position : position1,position2,...,positionN;
background-size : size1,size2,...,sizeN;
background-attachment : attachment1,attachment2,...,attachmentN;
background-clip : clip1,clip2,...,clipN;
background-origin : origin1,origin2,...,originN;
background-color : color;

注意：

• 用逗号隔开每组 background 的缩写值；
• 如果有 size 值，需要紧跟 position 并且用 "/" 隔开；
• 如果有多个背景图片，而其他属性只有一个（例如 background-repeat 只有一个），表明所有背景图片应用该属性值。
• background-color 只能设置一个。

尝试一下 »