Najwyższy nagłówek na stronie DevSite musi być <h1>
. Główna część strony nie może zawierać innego elementu <h1>
, aby nie wprowadzać w błąd przeglądarek niewizualnych.
Narzędzie nbgenerate
konwertuje treści i szablony w formacie HTML i Markdown na stronie dewelopera na notatniki Jupyter zgodne z Colab.
Rozmiary
Nagłówek 1
Nagłówek 2
Nagłówek 3
Nagłówek 4
Nagłówek 5
Nagłówek 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
Spis treści
Na stronie DevSite elementy <h2>
i <h3>
są automatycznie dodawane do spisu treści „Na tej stronie”.
Ukrywanie nagłówków w spisie treści
Aby zapobiec dodaniu nagłówka (np. „Nagłówek 2” i „Nagłówek 3” w sekcji powyżej, które nie pojawiają się w warunkach korzystania z usługi), zastosuj class="hide-from-toc"
.
Nagłówek 2
Nagłówek 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}
Dostosowywanie tekstu nagłówka w spisie treści
Jeśli chcesz, aby tekst w Warunkach korzystania z usługi różnił się od rzeczywistego nagłówka (jak w tym przypadku), ustaw atrybut data-text
w nagłówku:
Nagłówek 2
HTML
<h2 data-text="Custom text for the ToC">Heading 2</h2>
Markdown
## Heading 2 {: data-text='Custom text for the ToC'}
Dodawanie nagłówków w tabelach w spisie treści
Aby wymusić umieszczenie tabeli w spisie treści, możesz też umieścić w nagłówku tabeli (<th>
) znak <h2>
lub <h3>
. W nagłówku tabeli <h2>
i <h3>
mają styl zwykłego tekstu, więc czytelnicy nie będą w stanie ich odróżnić.
Linki do kopiowania po kliknięciu
Na stronach dokumentacji (nie na stronach „pełnoszerokości”, takich jak większość stron docelowych) nagłówki inne niż <h1>
mają też przycisk kopiowania linku, który pojawia się tylko wtedy, gdy najedziesz kursorem na nagłówek.
Aby wyłączyć ten przycisk w przypadku konkretnego nagłówka, zastosuj do niego class="no-link"
.
Nagłówek 4
Nagłówek 5
HTML
<h4 class="no-link">Heading 4</h4>
<h5 class="no-link">Heading 5</h5>
Markdown
## Heading 4 {:.no-link}
### Heading 5 {:.no-link}
Aby wymusić wyświetlanie przycisku linku w nagłówku, który normalnie nie miałby przycisku (np. <h1>
lub dowolny nagłówek na stronie o pełnej szerokości), dodaj do nagłówka class="add-link"
.
Nagłówek 1
HTML
<h1 class="add-link">Heading 1</h1>
Markdown
# Heading 1 {:.add-link}
Nagłówki numerowane
Aby dodać przed nagłówkami <h2>
kolejne numery, aby oznaczać sekcje z zawartością złożoną jako odrębne kroki w wielostopniowym procesie, dodaj do każdego nagłówka numerowaną klasę.
Pierwszy ponumerowany nagłówek
Złożone treści, które składają się z akapitów, list, tabel, obrazów, filmów i widżetów.
Drugi numerowany nagłówek
Złożone treści, które składają się z akapitów, list, tabel, obrazów, filmów i widżetów.
Trzeci numerowany nagłówek
Złożone treści, które składają się z akapitów, list, tabel, obrazów, filmów i widżetów.
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.
Numerowane podrozdziały
Aby nagłówki <h3>
, które następują po nagłówkach <h2>
, miały przedrostki z liczbami kolejnymi, dodaj do każdego nagłówka <h3>
klasę z liczbą.
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.
Nagłówek z numerem
Złożone treści, które składają się z akapitów, list, tabel, obrazów, filmów i widżetów.
Numerowany podtytuł
Złożone treści, które składają się z akapitów, list, tabel, obrazów, filmów i widżetów.
Numerowany podtytuł
Złożone treści, które składają się z akapitów, list, tabel, obrazów, filmów i widżetów.
Numerowany podtytuł
Złożone treści, które składają się z akapitów, list, tabel, obrazów, filmów i widżetów.