<w> smolweb

var: The Variable element

The <var> HTML element represents the name of a variable in a mathematical expression or a programming context. It’s typically presented using an italicized version of the current typeface, although that behavior is browser-dependent.

Attributes

Global attributes

accesskey Specifies a keyboard shortcut to activate or focus an element.

aria-* Defines accessibility properties and states for assistive technologies.

class Specifies one or more CSS class names for styling the element.

data-* Stores custom data private to the page or application.

dir Sets the text direction (left-to-right, right-to-left, or auto).

hidden Hides the element from display and assistive technologies.

id Defines a unique identifier for the element within the document.

inputmode Hints which virtual keyboard type to display on mobile devices.

itemid Provides a global identifier for microdata items.

itemprop Defines a property name-value pair for microdata.

itemref Associates properties with an item via element IDs for microdata.

itemscope Creates a new microdata item container.

itemtype Specifies the vocabulary URL for microdata items (like Schema.org).

lang Specifies the primary language of the element’s content.

nonce Provides a cryptographic nonce for Content Security Policy.

role Defines the element’s semantic role for accessibility.

tabindex Controls keyboard navigation order and focusability.

title Provides advisory information displayed as a tooltip.

Example

<p>In your CSS, you can use custom properties like <var>--primary-color</var> to maintain consistent theming across your site.</p>

<p>When setting up your static site generator, configure the <var>baseURL</var> variable to match your domain name.</p>

<p>The formula for calculating your website's carbon footprint is roughly <var>data_transfer</var> × <var>energy_intensity</var> × <var>carbon_intensity</var>.</p>

<p>In your build script, set the <var>NODE_ENV</var> environment variable to <code>production</code> for optimized builds.</p>

<p>Your web analytics might track variables like <var>page_views</var>, <var>unique_visitors</var>, and <var>bounce_rate</var> to understand your audience.</p>