CSS ??? ?? ?? var () ??? ? ?? ?? ??? ?? ????, ?? ??? ???? ???? ???? ?? ?? ???? ?????. ?? ??, .box {back },-?? ??? ???? ???? ???? ?? ?? ???? #CCC? ?????. ?? ?? ??, ??? ? ?? ??? ?? ??? CSS ? ??? ?????. 1. ?? ?? ?? : var (-??, 1rem); 2. ?? ?? ??-??? : var (-Heading Font, Sans-Serif); 3. ?? ? ?? ?? : var (-Text-Color, var (-?? ??? ??, ?? ?)); ??? ??? ????? ??? ?? (? : -my-width : red; width : var (-my-width, 50%);) ? ? ?? ????? ???? ????. ?? ???? ??? ?????. ?? ?? ?? : ??, ??? ?? ??, ?? ?? ???? ???? ?? ?? ? ???? ??? ? ?? ??? ?? ?? ???? ?? ?? ??? ?????.

var() ??? ? ?? ?? ??? ???? CSS ??? ?? ?? ??? ? ????. ??? ???? ???? ???? ?? ?? ???? ??? ?? ? ?? ?????.

??? ???? ?? ??

??? ?? ??, ?? ?? ?? ?? ??? ?? CSS ??? ???? ?? ? ????. ???? ??? ?? ??? ??, ??? ??? ??? ??? ?? ?? ? ??????.

?? ??:

 : ?? {
  / *-?? ??? ?????? ???? ?? ? ???? */
}

.?? {
  ??? : var (-Main-Color, #CCC);
}

? ?? --main-color ???? ??? ???? ?? ?? .box #ccc ????? ?????.

?? ???? ??? ???? ??

?? ?? ??? ??? ??? ??, ??? ?? ?? ??? ?? ?? ??? CSS ??? ?????.

? ?? ???? ?? ??? ??? ????.

• ?? ??

   ?? : var (-Spacing, 1rem);

• ?? ?? ??

   Font-Family : var (-Heading Font, Sans-Serif);

• ?? ?? (?? ?? ??)

   ?? : var (-Text-Color, var (-??-??? ??, ??));

??? ??? ??? ?????? ??? ?? ? ?? ?? ???? ?? ? ? ????.

??? ???? ?? ?

??? var() ????? ?????? ?? ??? ??? ????. var() ??? ?? ???? ?? ?? ????? ?? ??? ??? ????. ?? ??? ????? ???? ?? ?? ? ?? ?? ?? ??? ???? ????.

?? ??:

 ?? : var (-? ?, 50%); / * ??-My-Width? ???? ???? ???? ?? ?? */

??? ??? ??? ?? ????? :

 -My-Width : ???;
?? : var (-? ?, 50%); / * '?'? ?? ????? ??? '???' */? ?????.

????? red ??? ????? ????? ??? ??? 50% ? ???? ????.

??? ??? ??? ?????? ???? ????. ??? ????? ?? ? ?? ? ????.

?? ????? ?? ??

• :root ??? ??? ?? ?? ?? ??? ??????.
• ?? ?? ??? ???? ??? ???? ????????.
• ????? ??? ? ???? ???? ?? ? ??? ???? ??????.
• ??? ?? ? ??? ??? ???? - ?? ??? ???? ?? ?? ?????.

??? ? ?? ? : ??? ??? ?? ?? ?? ? ? ??? ?? ???? ????? ?? ???? ?? ? ? ?????.

?????, ??? ?? ?? ???? ?? ???? ??? ?? ?????.

? ??? CSS ??? ?? ?? ???? ??? ??????? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!