Intestazioni

L'intestazione più in alto di una pagina di DevSite deve essere un <h1>. Il corpo della pagina non deve contenere un altro <h1> per evitare di confondere i browser non visivi. Lo strumento nbgenerate converte i contenuti e i modelli HTML e Markdown di DevSite in blocchi note Jupyter compatibili con Colab.

Dimensioni

Intestazione 1

Intestazione 2

Intestazione 3

Intestazione 4

Intestazione 5
Intestazione 6

HTML

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

Markdown

# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6

Sommario

In DevSite, <h2> e <h3> vengono aggiunti automaticamente all'indice "In questa pagina".

Nascondere le intestazioni dal sommario

Per impedire l'aggiunta di un titolo (ad esempio "Titolo 2" e "Titolo 3" nella sezione precedente, che non compaiono nell'Indice), applica class="hide-from-toc".

Intestazione 2

Intestazione 3

HTML

<h2 class="hide-from-toc">Heading 2</h2>
<h3 class="hide-from-toc">Heading 3</h3>

Markdown

## Heading 2 {:.hide-from-toc}
### Heading 3 {:.hide-from-toc}

Personalizzare il testo delle intestazioni nell'Indice

Se vuoi che il testo nell'Indice dei contenuti sia diverso dall'intestazione effettiva (come questa sezione), imposta un attributo data-text sull'intestazione:

Intestazione 2

HTML

<h2 data-text="Custom text for the ToC">Heading 2</h2>

Markdown

## Heading 2 {: data-text='Custom text for the ToC'}

Includi le intestazioni all'interno delle tabelle nell'Indice

Puoi anche inserire <h2> o <h3> all'interno di un'intestazione di tabella (<th>) per inserire forzatamente la tabella nell'Indice. All'interno di un'intestazione di tabella, <h2> e <h3> hanno lo stesso stile del testo normale, quindi i lettori non saranno in grado di distinguerli.

Nelle pagine della documentazione (non quelle "a larghezza intera" come la maggior parte delle pagine di destinazione), le intestazioni diverse da <h1> dispongono anche di un pulsante per copiare il link, che viene visualizzato solo quando passi il mouse sopra l'intestazione.

Per disattivare questo pulsante per un'intestazione specifica, applica class="no-link" all'intestazione.

HTML

<h4 class="no-link">Heading 4</h4>
<h5 class="no-link">Heading 5</h5>

Markdown

## Heading 4 {:.no-link}
### Heading 5 {:.no-link}

Per forzare la visualizzazione del pulsante del link in un'intestazione che altrimenti non lo avrebbe (ad esempio un <h1> o qualsiasi intestazione in una pagina a larghezza intera), aggiungi class="add-link" all'intestazione.

Intestazione 1

HTML

<h1 class="add-link">Heading 1</h1>

Markdown

# Heading 1 {:.add-link}

Intestazioni numerate

Per anteporre alle intestazioni <h2> numeri sequenziali per designare le sezioni con contenuti complessi come passaggi distinti in una procedura in più passaggi, aggiungi una classe numerata a ogni intestazione.

Prima intestazione numerata

Contenuti complessi composti da paragrafi, elenchi, tabelle, immagini, video, widget.

Seconda intestazione numerata

Contenuti complessi composti da paragrafi, elenchi, tabelle, immagini, video, widget.

Terza intestazione numerata

Contenuti complessi composti da paragrafi, elenchi, tabelle, immagini, video, widget.

HTML

<h2 class="numbered">First numbered heading</h2>

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

<h2 class="numbered">Second numbered heading</h2>

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

<h2 class="numbered">Third numbered heading</h2>

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

Markdown

## First numbered heading {:.numbered}

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

## Second numbered heading {:.numbered}

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

## Third numbered heading {:.numbered}

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

Sottotitoli numerati

Per anteporre un prefisso alle intestazioni <h3> che seguono le intestazioni <h2> con numeri sequenziali, aggiungi una classe numerata a ogni intestazione <h3>.

HTML

<h2 class="numbered">Numbered heading</h2>

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

<h3 class="numbered">Numbered subheading</h3>

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

<h3 class="numbered">Numbered subheading</h3>

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

<h3 class="numbered">Numbered subheading</h3>

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

Markdown

## Numbered heading {:.numbered}

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

### Numbered subheading {:.numbered}

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

### Numbered subheading {:.numbered}

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

### Numbered subheading {:.numbered}

Complex content composed of paragraphs, lists, tables, images, videos, widgets.

Intestazione numerata

Contenuti complessi composti da paragrafi, elenchi, tabelle, immagini, video, widget.

Sottotitolo numerato

Contenuti complessi composti da paragrafi, elenchi, tabelle, immagini, video, widget.

Sottotitolo numerato

Contenuti complessi composti da paragrafi, elenchi, tabelle, immagini, video, widget.

Sottotitolo numerato

Contenuti complessi composti da paragrafi, elenchi, tabelle, immagini, video, widget.