CSS 背景屬性用于定義元素的背景效果。
您将學習如下 CSS 背景屬性:
background-color 屬性指定元素的背景色。
實例頁面的背景色設置如下:
body {background-color: lightblue;}
通過 CSS,顔色通常由以下方式指定:
- 有效的顔色名稱 - 比如 "red"
- 十六進制值 - 比如 "#ff0000"
- RGB 值 - 比如 "rgb(255,0,0)"
其他元素
您可以為任何 HTML 元素設置背景顔色:
實例在這裡,<h1>、<p> 和 <div> 元素将擁有不同的背景色:
h1 {background-color: green;}div {background-color: lightblue;}p {background-color: yellow;}
不透明度 / 透明度opacity 屬性指定元素的不透明度/透明度。取值範圍為 0.0 - 1.0。值越低,越透明:
實例
div {background-color: green;opacity: 0.3;}
注意:使用 opacity 屬性為元素的背景添加透明度時,其所有子元素都繼承相同的透明度。這可能會使完全透明的元素内的文本難以閱讀。
使用 RGBA 的透明度如果您不希望對子元素應用不透明度,例如上面的例子,請使用 RGBA 顔色值。下面的例子設置背景色而不是文本的不透明度:
RGBA 顔色值指定為:rgba(red, green, blue, alpha)。alpha 參數是介于 0.0(完全透明)和 1.0(完全不透明)之間的數字。
實例div {background: rgba(0, 128, 0, 0.3) /* 30% 不透明度的綠色背景 */}
,更多精彩资讯请关注tft每日頭條,我们将持续为您更新最新资讯!