tab-size

Ejemplos

Ejemplo básico

Usa utilidades tab-<number> como tab-2 y tab-8 para controlar el tamaño de los caracteres de tabulación:

function indent() {	return 'tabbed';}

function indent() {	return 'tabbed';}

<pre class="tab-2 ...">function indent() {&#10;&#9;return 'tabbed'&#10;}</pre><pre class="tab-8 ...">function indent() {&#10;&#9;return 'tabbed'&#10;}</pre>

Usar un valor personalizado

Usa la sintaxis tab-[<value>] para establecer el/la tab size basándose en un valor completamente personalizado:

<pre class="tab-[12px] ...">  <!-- ... --></pre>

Para variables CSS, también puedes usar la sintaxis tab-(<custom-property>) :

<pre class="tab-(--my-tab-size) ...">  <!-- ... --></pre>

Esto es solo un atajo para tab-[var(<custom-property>)] que añade la función var() por ti automáticamente.

Diseño responsivo

Antepone a la utilidad tab-size el prefijo de una variante de punto de ruptura como md: para aplicar la utilidad únicamente en tamaños de pantalla mediano y superiores:

<pre class="tab-4 md:tab-8 ...">  <!-- ... --></pre>

Obtén más información sobre el uso de variantes en la documentación de variantes.