2018-01-06 15:12:53 +03:00
|
|
|
---
|
2018-04-04 03:33:19 +03:00
|
|
|
description: "Howdy! This is an example blog post that shows several types of HTML content supported in this theme."
|
|
|
|
title: "Example Content"
|
|
|
|
layout: post
|
2018-01-06 15:12:53 +03:00
|
|
|
---
|
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
<div class="message">
|
|
|
|
{{ page.description | smartify | strip_html | normalize_whitespace }}
|
|
|
|
</div>
|
2018-01-06 15:12:53 +03:00
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
Cum sociis natoque penatibus et magnis <a href="#">dis parturient montes</a>, nascetur ridiculus mus.
|
|
|
|
*Aenean eu leo quam.*
|
|
|
|
Pellentesque ornare sem lacinia quam venenatis vestibulum.
|
|
|
|
Sed posuere consectetur est at lobortis.
|
|
|
|
Cras mattis consectetur purus sit amet fermentum.
|
2018-01-06 15:12:53 +03:00
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
> Curabitur blandit tempus porttitor.
|
|
|
|
Nullam quis risus eget urna mollis ornare vel eu leo.
|
|
|
|
Nullam id dolor id nibh ultricies vehicula ut id elit.
|
2018-01-06 15:12:53 +03:00
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
Etiam porta **sem malesuada magna** mollis euismod.
|
|
|
|
Cras mattis consectetur purus sit amet fermentum.
|
|
|
|
Aenean lacinia bibendum nulla sed consectetur.
|
2018-01-06 15:12:53 +03:00
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
## Inline HTML elements
|
2018-01-06 15:12:53 +03:00
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
HTML defines a long list of available inline tags, a complete list of which can be found on the
|
|
|
|
[Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Web/HTML/Element).
|
2018-01-06 15:12:53 +03:00
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
- **To bold text**, use `<strong>`.
|
|
|
|
- *To italicize text*, use `<em>`.
|
|
|
|
- Abbreviations, like <abbr title="HyperText Markup Langage">HTML</abbr> should use `<abbr>`, with an optional `title` attribute for the full phrase.
|
|
|
|
- Citations, like <cite>— Mark otto</cite>, should use `<cite>`.
|
|
|
|
- <del>Deleted</del> text should use `<del>` and <ins>inserted</ins> text should use `<ins>`.
|
|
|
|
- Superscript <sup>text</sup> uses `<sup>` and subscript <sub>text</sub> uses `<sub>`.
|
2018-01-06 15:12:53 +03:00
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
Most of these elements are styled by browsers with few modifications on our part.
|
2018-01-06 15:12:53 +03:00
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
## Heading
|
2018-01-06 15:12:53 +03:00
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
Vivamus sagittis lacus vel augue rutrum faucibus dolor auctor.
|
|
|
|
Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.
|
|
|
|
Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
|
2018-01-06 15:12:53 +03:00
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
### Code
|
2018-01-06 15:12:53 +03:00
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
Cum sociis natoque penatibus et magnis dis `code element` montes, nascetur ridiculus mus.
|
2018-01-06 15:12:53 +03:00
|
|
|
|
|
|
|
{% highlight js %}
|
2018-04-04 03:33:19 +03:00
|
|
|
// Example can be run directly in your JavaScript console
|
2018-01-06 15:12:53 +03:00
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
// Create a function that takes two arguments and returns the sum of those arguments
|
|
|
|
var adder = new Function("a", "b", "return a + b");
|
2018-01-06 15:12:53 +03:00
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
// Call the function
|
|
|
|
adder(2, 6);
|
|
|
|
// > 8
|
2018-01-06 15:12:53 +03:00
|
|
|
{% endhighlight %}
|
|
|
|
|
2018-04-04 03:33:19 +03:00
|
|
|
Aenean lacinia bibendum nulla sed consectetur.
|
|
|
|
Etiam porta sem malesuada magna mollis euismod.
|
|
|
|
Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa.
|
|
|
|
|
|
|
|
### Gists via GitHub Pages
|
|
|
|
|
|
|
|
Vestibulum id ligula porta felis euismod semper.
|
|
|
|
Nullam quis risus eget urna mollis ornare vel eu leo.
|
|
|
|
Donec sed odio dui.
|
|
|
|
|
|
|
|
{% gist 5555251 gist.md %}
|
|
|
|
|
|
|
|
Aenean eu leo quam.
|
|
|
|
Pellentesque ornare sem lacinia quam venenatis vestibulum.
|
|
|
|
Nullam quis risus eget urna mollis ornare vel eu leo.
|
|
|
|
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
|
|
|
Donec sed odio dui.
|
|
|
|
Vestibulum id ligula porta felis euismod semper.
|
|
|
|
|
|
|
|
### Lists
|
|
|
|
|
|
|
|
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
|
|
|
Aenean lacinia bibendum nulla sed consectetur.
|
|
|
|
Etiam porta sem malesuada magna mollis euismod.
|
|
|
|
Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
|
|
|
|
|
|
|
|
* Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
|
|
|
|
* Donec id elit non mi porta gravida at eget metus.
|
|
|
|
* Nulla vitae elit libero, a pharetra augue.
|
|
|
|
|
|
|
|
Donec ullamcorper nulla non metus auctor fringilla.
|
|
|
|
Nulla vitae elit libero, a pharetra augue.
|
|
|
|
|
|
|
|
1. Vestibulum id ligula porta felis euismod semper.
|
|
|
|
2. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
|
|
|
|
3. Maecenas sed diam eget risus varius blandit sit amet non magna.
|
|
|
|
|
|
|
|
Cras mattis consectetur purus sit amet fermentum.
|
|
|
|
Sed posuere consectetur est at lobortis.
|
|
|
|
|
|
|
|
<dl>
|
|
|
|
<dt>HyperText Markup Language (HTML)</dt>
|
|
|
|
<dd>The language used to describe and define the content of a Web page</dd>
|
|
|
|
|
|
|
|
<dt>Cascading Style Sheets (CSS)</dt>
|
|
|
|
<dd>Used to describe the appearance of Web content</dd>
|
|
|
|
|
|
|
|
<dt>JavaScript (JS)</dt>
|
|
|
|
<dd>The programming language used to build advanced Web sites and applications</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
Integer posuere erat a ante venenatis dapibus posuere velit aliquet.
|
|
|
|
Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
|
|
|
|
Nullam quis risus eget urna mollis ornare vel eu leo.
|
|
|
|
|
|
|
|
### Images
|
|
|
|
|
|
|
|
Quisque consequat sapien eget quam rhoncus, sit amet laoreet diam tempus.
|
|
|
|
Aliquam aliquam metus erat, a pulvinar turpis suscipit at.
|
|
|
|
|
|
|
|
![placeholder](http://placehold.it/800x400 "Large example image")
|
|
|
|
![placeholder](http://placehold.it/400x200 "Medium example image")
|
|
|
|
![placeholder](http://placehold.it/200x200 "Small example image")
|
|
|
|
|
|
|
|
### Tables
|
|
|
|
|
|
|
|
Aenean lacinia bibendum nulla sed consectetur.
|
|
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
|
|
|
|
|
|
|
<table>
|
|
|
|
<thead>
|
|
|
|
<tr>
|
|
|
|
<th>Name</th>
|
|
|
|
<th>Upvotes</th>
|
|
|
|
<th>Downvotes</th>
|
|
|
|
</tr>
|
|
|
|
</thead>
|
|
|
|
<tfoot>
|
|
|
|
<tr>
|
|
|
|
<td>Totals</td>
|
|
|
|
<td>21</td>
|
|
|
|
<td>23</td>
|
|
|
|
</tr>
|
|
|
|
</tfoot>
|
|
|
|
<tbody>
|
|
|
|
<tr>
|
|
|
|
<td>Alice</td>
|
|
|
|
<td>10</td>
|
|
|
|
<td>11</td>
|
|
|
|
</tr>
|
|
|
|
<tr>
|
|
|
|
<td>Bob</td>
|
|
|
|
<td>4</td>
|
|
|
|
<td>3</td>
|
|
|
|
</tr>
|
|
|
|
<tr>
|
|
|
|
<td>Charlie</td>
|
|
|
|
<td>7</td>
|
|
|
|
<td>9</td>
|
|
|
|
</tr>
|
|
|
|
</tbody>
|
|
|
|
</table>
|
|
|
|
|
|
|
|
Nullam id dolor id nibh ultricies vehicula ut id elit.
|
|
|
|
Sed posuere consectetur est at lobortis.
|
|
|
|
Nullam quis risus eget urna mollis ornare vel eu leo.
|
|
|
|
|
|
|
|
-----
|
|
|
|
|
|
|
|
Want to see something else added?
|
|
|
|
<a href="https://github.com/poole/poole/issues/new">Open an issue.</a>
|