'How do we assign a value to a variable and display the value without the aid of scripts?

This is a long shot (it may not be possible w/o scripting). On my website I would like to set numerical values one time (perhaps in the .css file?).

Example:

shipping_1 = 3.99
shipping_2 = 4.25
shipping_3 = 7.58

and be able to reference these shipping rates by name on various pages and have the numerical value display (it could even be text because no calculations would be made). The purpose is change the shipping values one time in one file and have them updated on the various pages.

htmlcss


Solution 1:[1]

If you really need to use just CSS then you could have something like this in a CSS file:

:root {
--sv1: '3.2';
--sv2: '4.2';
--sv3: '3.1';
}
.sv1::after {
  content: var(--sv1);
}
.sv2::after {
  content: var(--sv2);
}
.sv3::after {
  content: var(--sv3);
}

and in each of your pages you could just bring in the value that page represents e.g.:

<div class="sv2">Shipping value: </div>

However, I do not recommend it in the general case because screen readers may not read out the contents part (as CSS is really for styling not for actual real content) so someone relying on a screen reader may not hear the actual price.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 A Haworth

Related Questions