mirror of
https://github.com/picocss/pico.git
synced 2025-04-25 10:46:14 -04:00
docs: Style of code snippets
This commit is contained in:
parent
22767f6361
commit
132b499db2
2 changed files with 4 additions and 3 deletions
|
@ -25,7 +25,7 @@
|
||||||
<<b>li</b>><<b>a</b> <i>href</i>=<u>"#"</u>>Link</<b>a</b>></<b>li</b>>
|
<<b>li</b>><<b>a</b> <i>href</i>=<u>"#"</u>>Link</<b>a</b>></<b>li</b>>
|
||||||
</<b>ul</b>>
|
</<b>ul</b>>
|
||||||
</<b>nav</b>>
|
</<b>nav</b>>
|
||||||
</<b>aside</b>></code></pre></footer></article><p>With <code><b>aria-label="breadcrumb"</b></code>, you can turn a nav into a breadcrumb, specifying the current page with: <code><b>aria-current="page"</b></code>.</p><article aria-label="breadcrumb nav example"><nav aria-label="breadcrumb"><ul><li><a href="#">First link</a></li><li><a href="#">Second link</a></li><li><a aria-current="page">Last link</a></li></ul></nav><footer class="code"><pre><code><<b>nav</b> <i>aria-label</i>=<u>"breadcrumb"</u>>
|
</<b>aside</b>></code></pre></footer></article><p>With <code><i>aria-label</i>=<u>"breadcrumb"</u></code>, you can turn a nav into a breadcrumb, specifying the current page with: <code><i>aria-current</i>=<u>"page"</u></code>.</p><article aria-label="breadcrumb nav example"><nav aria-label="breadcrumb"><ul><li><a href="#">First link</a></li><li><a href="#">Second link</a></li><li><a aria-current="page">Last link</a></li></ul></nav><footer class="code"><pre><code><<b>nav</b> <i>aria-label</i>=<u>"breadcrumb"</u>>
|
||||||
<<b>ul</b>>
|
<<b>ul</b>>
|
||||||
<<b>li</b>><<b>a</b> <i>href</i>=<u>"#"</u>>First link<<b>/a</b>><<b>/li</b>>
|
<<b>li</b>><<b>a</b> <i>href</i>=<u>"#"</u>>First link<<b>/a</b>><<b>/li</b>>
|
||||||
<<b>li</b>><<b>a</b> <i>href</i>=<u>"#"</u>>Second link<<b>/a</b>><<b>/li</b>>
|
<<b>li</b>><<b>a</b> <i>href</i>=<u>"#"</u>>Second link<<b>/a</b>><<b>/li</b>>
|
||||||
|
|
|
@ -117,7 +117,7 @@
|
||||||
</footer>
|
</footer>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<p>With <code><b>aria-label="breadcrumb"</b></code>, you can turn a nav into a breadcrumb, specifying the current page with: <code><b>aria-current="page"</b></code>.</p>
|
<p>With <code><i>aria-label</i>=<u>"breadcrumb"</u></code>, you can turn a nav into a breadcrumb, specifying the current page with: <code><i>aria-current</i>=<u>"page"</u></code>.</p>
|
||||||
|
|
||||||
<article aria-label="breadcrumb nav example">
|
<article aria-label="breadcrumb nav example">
|
||||||
<nav aria-label="breadcrumb">
|
<nav aria-label="breadcrumb">
|
||||||
|
@ -138,13 +138,14 @@
|
||||||
|
|
||||||
<footer class="code">
|
<footer class="code">
|
||||||
|
|
||||||
<pre><code><<b>nav</b> <i>aria-label</i>=<u>"breadcrumb"</u>>
|
<pre><code><<b>nav</b> <i>aria-label</i>=<u>"breadcrumb"</u>>
|
||||||
<<b>ul</b>>
|
<<b>ul</b>>
|
||||||
<<b>li</b>><<b>a</b> <i>href</i>=<u>"#"</u>>First link<<b>/a</b>><<b>/li</b>>
|
<<b>li</b>><<b>a</b> <i>href</i>=<u>"#"</u>>First link<<b>/a</b>><<b>/li</b>>
|
||||||
<<b>li</b>><<b>a</b> <i>href</i>=<u>"#"</u>>Second link<<b>/a</b>><<b>/li</b>>
|
<<b>li</b>><<b>a</b> <i>href</i>=<u>"#"</u>>Second link<<b>/a</b>><<b>/li</b>>
|
||||||
<<b>li</b>><<b>a</b> <i>aria-current</i>=<u>"page"</u>>Last link<<b>/a</b>><<b>/li</b>>
|
<<b>li</b>><<b>a</b> <i>aria-current</i>=<u>"page"</u>>Last link<<b>/a</b>><<b>/li</b>>
|
||||||
<<b>/ul</b>>
|
<<b>/ul</b>>
|
||||||
</<b>nav</b>></code></pre>
|
</<b>nav</b>></code></pre>
|
||||||
|
|
||||||
</footer>
|
</footer>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue