លក្ខណៈពិសេសមួយទៀតរបស់ភាសា CSS គឺវាអនុញ្ញាតអោយយើងអាចប្រើប្រាស់ variable ក្នុងការកំណត់តំលៃផ្សេងៗសំរាប់ property ទាំងឡាយ។ ក៏ប៉ុន្តែ យើងចាំបាច់ត្រូវគោរពទៅតាមក្បូនខ្នាតនៅក្នុងភាសា CSS ក្នុងការបង្កើត variable ដែលចាំបាច់ត្រូវមានសញ្ញា - - នៅពីមុខ។

<!DOCTYPE html>
<html>
  <head>
  	<meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  	<title>CSS Variable</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>
	The var() Function

	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit.
	


	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit.
	


	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit.
  </body>
</html>

The var() Function

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam semper diam at erat pulvinar, at pulvinar felis blandit.