CSS کی مدیا کوئری میں متغیر کا استعمال

Use JavaScript to change variables

CSS variables can access DOM, which means you can change them with JavaScript.

ਇਹ ਉਦਾਹਰਣ ਦਿਸ਼ਾ ਦਿੰਦਾ ਹੈ ਕਿ ਕਿਵੇਂ ਸਕ੍ਰਿਪਟ ਬਣਾਓ ਜੋ ਪਿਛਲੀ ਪੰਨੇ 'ਚ ਵਰਤੇ --blue ਵਰਗੇ ਵੱਡੇ ਵੇਰਵੇ ਦਿਖਾਉਣ ਅਤੇ ਬਦਲਣ ਵਾਲਾ ਹੋਵੇ। ਇਸ ਵੇਲੇ ਜੇਕਰ ਤੁਸੀਂ JavaScript ਨਾਲ ਅਣਗਿਣਤ ਹੋ, ਚਿੰਤਾ ਨਾ ਕਰੋ। ਤੁਸੀਂ JavaScript ਦੇ ਬਾਰੇ ਵਧੇਰੇ ਜਾਣਕਾਰੀ ਸਿੱਖ ਸਕਦੇ ਹੋ ਸਾਡੇ JavaScript ਟਰੇਨਿੰਗ ਕੋਰਸ ਵਿੱਚ:

实例

<script>
// Get the root element
var r = document.querySelector(':root');
// Create a function to get the value of the variable
function myFunction_get() {
  // Get the styles (properties and values) for the root
  var rs = getComputedStyle(r);
  // Alert the value of the --blue variable
  alert("The value of --blue is: " + rs.getPropertyValue('--blue'));
r.style.setProperty('--blue', 'lightblue');
// 创建设置变量值的函数
// Create a function to set the variable value
  function myFunction_set() {
  // Set the value of variable --blue to another value (in this case "lightblue")
r.style.setProperty('--blue', 'lightblue');
}

</script>

پرس کریں اور امتحان کریں

مرورگر سپورٹ

36.0
وصف تبدیل میں کی گئی اعداد نے پہلے مرورگر کی سہولت کو نشان دےتی ہیں جو اس کی اپنائی اور پورا کردی اور اس کا مرورگر سپورٹ 49.0 15.0 31.0 9.1

کمپنی کے بارے میں

36.0 فونکشن
وصف var()