Variables

CSS and Python both have variables. Today, I will talk about how to define and access variables in both CSS and Python, and what variables each language are used for.

Defining Variables

CSS

To create a variable with global scope, declare it inside the :root selector. The :root selector matches the document's root element.
The variable name needs to start with --.

:root {
  --primary: #14a316;
  --font-color: black;
  --logo-url: url('../images/logo.jpg');
}

Python

To define a variable in Python, you can just do [var_name] = [value]

number = 5

Accessing variables

CSS

To access a variable, you need to retrieve the variable using var(var_name)

body {
  color: var(--font-color)
}

Python

To access a variable in Python, you can just use the variable name.

print(number)

What variables are used for

CSS

In CSS, variables are used so you don't need to repeat the colour or url every time in your code.
CSS variables have access to the DOM, which means that you can create variables with local or global scope, change the variables with JavaScript, and change the variables based on media queries.
Variables can be used to hold colors, urls and content.

Python

Variables in Python can be used to hold any data types.
Variables do not need to be declared with any particular type, and can even change type after they have been set.

In conclusion, variables are in both CSS and Python, and they are both used for accessibility, but they are defined for completely different purposes.

Thanks for reading, and follow me for more content like this!