Source: css/4-base/base.body.scss, line 1

4.1 Body

Base styling on the body element.

Source: css/4-base/base.embedded-content.scss, line 1

4.2 Embedded content

Example

<img src="http://placehold.it/300x150">
<video src="public/assets/donatello.mp4" controls></video>
<embed src="public/assets/donatello.mp4" type="video/mp4">
<object data="public/assets/donatello.mp4" type="video/mp4"></object>
<audio src="public/assets/donatello.mp3" controls></audio>
<canvas></canvas>

Source: css/4-base/base.forms.scss, line 1

4.3 Forms

Example

<form>
 <fieldset>
 <legend>Legend: radio</legend>
   <label> Male
     <input type="radio" name="sex" value="male">
   </label>
   <label> Female
     <input type="radio" name="sex" value="female">
   </label>
 </fieldset>
 <fieldset>
 <legend>Legend: checkbox</legend>
   <label> Checkbox 1
     <input type="checkbox" name="checkbox" value="value1">
   </label>
   <label> Checkbox 2
     <input type="checkbox" name="checkbox" value="value2">
   </label>
 </fieldset>
 <fieldset>
 <legend>Legend: select</legend>
   <select name="select">
     <option value="value1">Value 1</option>
     <option value="value2" selected>Value 2</option>
     <option value="value3">Value 3</option>
   </select>
 </fieldset>
 <fieldset>
 <legend>Legend: input</legend>
   <label> Email
     <input type="email" name="email" placeholder="name@email.com">
   </label>
   <label> Password
     <input type="password" name="password">
   </label>
 </fieldset>
 <button name="button">Click me</button>
</form>

Source: css/4-base/base.grouping-content.scss, line 1

4.4 Grouping content

Example

<hr>

Source: css/4-base/base.links.scss, line 1

4.5 Links

Example

Text link

<a href="#">Text link</a>

Source: css/4-base/base.lists.scss, line 1

4.6 Lists

Example

unordered item 1
unordered item 2
unordered item 3

ordered item 1
ordered item 2
ordered item 3

<ul>
 <li>unordered item 1</li>
 <li>unordered item 2</li>
 <li>unordered item 3</li>
</ul>
<ol>
 <li>ordered item 1</li>
 <li>ordered item 2</li>
 <li>ordered item 3</li>
</ol>

Source: css/4-base/base.tables.scss, line 1

4.7 Tables

Example

Header content 1	Header content 2
Body content 1	Body content 2
Footer content 1	Footer content 2

<table>
 <thead>
   <tr>
     <th>Header content 1</th>
     <th>Header content 2</th>
   </tr>
 </thead>
 <tbody>
   <tr>
     <td>Body content 1</td>
     <td>Body content 2</td>
   </tr>
 </tbody>
 <tfoot>
   <tr>
     <td>Footer content 1</td>
     <td>Footer content 2</td>
   </tr>
 </tfoot>
</table>

Source: css/4-base/base.text-level.scss, line 1

4.8 Text-level

Base styling for the headings, the paragraph and the addres element. Improve the readability on the selection pseudo-class.

Example

Heading 1