亚洲区国产区激情区无码区,国产成人mv视频在线观看,国产A毛片AAAAAA,亚洲精品国产首次亮相在线

CSS 參考手冊

CSS @規(guī)則(RULES)

CSS 屬性大全

CSS var() 函數(shù)

var()函數(shù)可以用作元素的任何屬性中的值。 var()函數(shù)不能用作屬性名稱，選擇器或除屬性值以外的任何東西。（這樣做通常會導(dǎo)致語法錯誤或與變量無關(guān)的值）。

CSS 函數(shù)

在線示例

定義一個名為 "--main-bg-color" 的屬性，然后使用 var() 函數(shù)調(diào)用該屬性：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鳥教程(cainiaoplus.com)</title>
<style>
:root {
  --main-bg-color: coral;  
}
#div1 {
  background-color: var(--main-bg-color);
  padding: 5px;  
}
#div2 {
  background-color: var(--main-bg-color);
  padding: 5px;
}
#div3 {
  background-color: var(--main-bg-color);
  padding: 5px;
}
</style>
</head>
<body>
<h1>var() 函數(shù)</h1>
<div id="div1">菜鳥教程(cainiaoplus.com) - 學(xué)好基礎(chǔ),才能走的更遠(yuǎn)！</div>
<br>
<div id="div2">菜鳥教程(cainiaoplus.com) - 學(xué)好基礎(chǔ),才能走的更遠(yuǎn)！</div>
<br>
<div id="div3">菜鳥教程(cainiaoplus.com) - 學(xué)好基礎(chǔ),才能走的更遠(yuǎn)！</div>
</body>
</html>
測試看看 ?/?

定義與用法

var() 函數(shù)用于插入自定義的屬性值，如果一個屬性值在多處被使用，該方法就很有用。

支持版本：CSS3

瀏覽器兼容性

表格中的數(shù)字表示支持該函數(shù)的第一個瀏覽器版本號。

函數(shù)




var()49.015.031.09.136.0

CSS 語法

var(custom-property-name, value)
值描述
custom-property-name必需。自定義屬性的名稱，必需以 --  開頭。
value可選。備用值，在屬性不存在的時候使用。

更多示例

在線示例

使用 var() 函數(shù)調(diào)用多個自定義的值：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鳥教程(cainiaoplus.com)</title>
<style>
:root {
  --main-bg-color: coral;
  --main-txt-color: blue;  
  --main-padding: 15px;  
}

#div1 {
  background-color: var(--main-bg-color);
  color: var(--main-txt-color);  
  padding: var(--main-padding);
}

#div2 {
  background-color: var(--main-bg-color);
  color: var(--main-txt-color);
  padding: var(--main-padding);
}

#div3 {
  background-color: var(--main-bg-color);
  color: var(--main-txt-color);
  padding: var(--main-padding);
}
</style>
</head>
<body>
<h1>var() 函數(shù)</h1>
<div id="div1">菜鳥教程(cainiaoplus.com) - 學(xué)好基礎(chǔ),才能走的更遠(yuǎn)！</div>
<br>
<div id="div2">菜鳥教程(cainiaoplus.com) - 學(xué)好基礎(chǔ),才能走的更遠(yuǎn)！</div>
<br>
<div id="div3">菜鳥教程(cainiaoplus.com) - 學(xué)好基礎(chǔ),才能走的更遠(yuǎn)！</div>
</body>
</html>
測試看看 ?/?

CSS 函數(shù)