The section components are simple layout elements with responsive padding. They are best used as
direct children of body.
Sponsor
Section
A simple container to divide your page into sections, like the one you’re currently reading
Example
Section
A simple container to divide your page into sections, like the one you're currently reading.
HTML
<section class="section">
<h1 class="title">Section</h1>
<h2 class="subtitle">
A simple container to divide your page into <strong>sections</strong>, like
the one you're currently reading.
</h2>
</section>Sizes #
You can use the modifiers is-medium and is-large to change the spacing.
Example
Medium section
A simple container to divide your page into sections, like the one you're currently reading.
HTML
<section class="section is-medium">
<h1 class="title">Medium section</h1>
<h2 class="subtitle">
A simple container to divide your page into <strong>sections</strong>, like
the one you're currently reading.
</h2>
</section>Example
Large section
A simple container to divide your page into sections, like the one you're currently reading.
HTML
<section class="section is-large">
<h1 class="title">Large section</h1>
<h2 class="subtitle">
A simple container to divide your page into <strong>sections</strong>, like
the one you're currently reading.
</h2>
</section>Sass and CSS variables #
|
Sass Variable
|
CSS Variable
|
Value
|
|---|---|---|
|
|
|
|
|
|
|
|
|
|
|
|
