Code
A <code> element wrapped in a <pre> element is used to generate code example blocks.
.selector {
color: #ccc;
}
<pre><code>.selector {
color: #ccc;
}</code></pre>
Figure
Semantic grouping of an image and associated caption
<figure itemscope itemtype="http://schema.org/ImageObject">
<img src="https://placehold.it/1600x800" alt="Figure Image" itemprop="contentUrl">
<figcaption itemprop="description">
<b>Fig. 3.2</b> Lorem ipsum dolor sit amet by <a href="#">eiusmod tempor</a>
</figcaption>
</figure>
Table
Caption ipsum dolor sit amet| Heading | Heading | Heading |
|---|
| Lorem ipsum dolor | Lorem ipsum dolor | Lorem ipsum dolor sit amet, consectetur adipiscing elit |
| Lorem ipsum dolor | Lorem ipsum dolor | Lorem ipsum dolor sit amet, consectetur adipiscing elit |
| Lorem ipsum dolor | Lorem ipsum dolor | Lorem ipsum dolor sit amet, consectetur adipiscing elit |
<div class="responsive-table">
<table class="table-bordered" itemscope itemtype="http://schema.org/Table">
<caption itemprop="about">Caption ipsum dolor sit amet</caption>
<thead>
<tr>
<th>Heading</th>
<th>Heading</th>
<th>Heading</th>
</tr>
</thead>
<tbody>
<tr>
<td>Lorem ipsum dolor</td>
<td>Lorem ipsum dolor</td>
<td>Lorem ipsum dolor sit amet, consectetur adipiscing elit</td>
</tr>
<tr>
<td>Lorem ipsum dolor</td>
<td>Lorem ipsum dolor</td>
<td>Lorem ipsum dolor sit amet, consectetur adipiscing elit</td>
</tr>
<tr>
<td>Lorem ipsum dolor</td>
<td>Lorem ipsum dolor</td>
<td>Lorem ipsum dolor sit amet, consectetur adipiscing elit</td>
</tr>
</tbody>
</table>
</div>