HTML Element Tag Tests
All other HTML tags listed in the FAQ:
Here is the address for Automattic, using the <address>
tag:
San Francisco, CA 94105
United States
This is an example of an <anchor>
(otherwise known as a link). This abbr. is an example of an <abbr> tag in the middle of a sentence. Here is a TLA showing off the <acronym>
tag. What, you want to see some over-sized text using the <big>
tag? Can you cite a reference for that, using the <cite>
tag? Have you noticed that all of the tag names are displayed in code-form
, using the <code>
tag? Similarly, I could emulate keyboard text, using the <kbd>
text tag, or emulate teletype text using the <tt>
tag.
Oh no! I wrote something incorrectly. I’d better delete it, using the <del>
tag. I could alternately strike something out using the <strike>
tag, or strike something out using the <s>
tag. So many choices, which I emphasize using the <em>
tag. Just to clarify, this is some inserted text, that I’ll highlight using the <ins>
tag.
Need to display completely unformatted text, such as a large block of code? Use the <pre>
tag, which lets you display:
#container { float: left; margin: 0 -240px 0 0; width: 100%; }
Want to quote the WordPress tagline Code is Poetry
? Use the <q>
tag to add quotes around it. This is strong text (otherwise known as bold), using the <strong>
tag.
Need to write H2O or E = MC2? You may find great use for subscripting text using the <sub>
tag, or for superscripting text using the <sup>
tag. Need to call out a variable? Use the <var>
tag.
Div and Span Tests
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
<div>
tag.Sed odio nibh, tincidunt adipiscing, pretium nec, tincidunt id, enim. Fusce scelerisque nunc vitae nisl.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. This is a span inside of a paragraph, using the <span>
tag. Sed odio nibh, tincidunt adipiscing, pretium nec, tincidunt id, enim. Fusce scelerisque nunc vitae nisl.
Definition List
- Definition List Title
- This is a definition list division.
- Definition
- An exact statement or description of the nature, scope, or meaning of something: our definition of what constitutes poetry.
- Gallery
- A feature introduced with WordPress 2.5, that is specifically an exposition of images attached to a post. In that same vein, an upload is “attached to a post” when you upload it while editing a post.
- Gravatar
- A globally recognized avatar (a graphic image or picture that represents a user). A gravatar is associated with an email address, and is maintained by the Gravatar.com service. Using this service, a blog owner can configure their blog so that a user’s gravatar is displayed along with their comments.
Inline Styles
How inline styles looks
There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don’t look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn’t anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures, to generate Lorem Ipsum which looks reasonable. The generated Lorem Ipsum is therefore always free from repetition, injected humour, or non-characteristic words etc.
Markers
It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using ‘Content here, content here’, making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for ‘lorem ipsum’ will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).
Block Quotes
Quotations Styles
It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures
Simple Quote
It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures
Table Styles
Simple table and table in box style
Table Header 1 | Table Header 2 | Table Header 3 | Table Header 4 | Table Header 5 |
---|---|---|---|---|
Lorem ipsum | Dolor sit | Consectetuer | Adipiscing elit | Diam |
Li europan | Lingues es | Del | Sam familie | Separat |
Consectetuer | Adipiscing elit | Diam | Nonummy nibh | Tincidunt |
Del | Sam familie | Separat | Existentie es | Myth |
Table With Box
Different Table
Table Header 1 | Table Header 2 | Table Header 3 | Table Header 4 |
---|---|---|---|
Lorem ipsum | Dolor sit | Consectetuer | Adipiscing elit |
Li europan | Lingues es | Del | Sam familie |
Consectetuer | Adipiscing elit | Diam | Nonummy nibh |
Del | Sam familie | Separat | Existentie es |
List Styles
List styles with different bullets
- Sample List Item 1
- Sample List Item 2
- Sample List Item 3
- Sample List Item 4
- Sample List Item 5
- Sample List Item 1
- Sample List Item 2
- Sample List Item 3
- Sample List Item 4
- Sample List Item 5
- Sample List Item 1
- Sample List Item 2
- Sample List Item 3
- Sample List Item 4
- Sample List Item 5
Ordered List
- Sample List Item 1
- Sample List Item 2
- Sample List Item 3
- Sample List Item 4
- Sample List Item 5
- Sample List Item 1
- Sample List Item 2
- Sample List Item 3
- Sample List Item 4
- Sample List Item 5
- Sample List Item 1
- Sample List Item 2
- Sample List Item 3
- Sample List Item 4
- Sample List Item 5
Boxes
Sample contents in boxes with style
Sample Exclamation Box
If you need help getting started, check out our documentation on First Steps with WordPress. If you’d rather dive right in, here are a few things most people do first when they set up a new WordPress site. If you need help, use the Help tabs in the upper right corner to get information on how to use your current screen and where to go for more assistance.
Sample Information Box
If you need help getting started, check out our documentation on First Steps with WordPress. If you’d rather dive right in, here are a few things most people do first when they set up a new WordPress site. If you need help, use the Help tabs in the upper right corner to get information on how to use your current screen and where to go for more assistance.
Sample Stop Box
If you need help getting started, check out our documentation on First Steps with WordPress. If you’d rather dive right in, here are a few things most people do first when they set up a new WordPress site. If you need help, use the Help tabs in the upper right corner to get information on how to use your current screen and where to go for more assistance.
Tabs
Horizontal and Vertical Tabs
1 If you need help getting started, check out our documentation on First Steps with WordPress. If you’d rather dive right in, here are a few things most people do first when they set up a new WordPress site. If you need help, use the Help tabs in the upper right corner to get information on how to use your current screen and where to go for more assistance.
2 If you need help getting started, check out our documentation on First Steps with WordPress. If you’d rather dive right in, here are a few things most people do first when they set up a new WordPress site. If you need help, use the Help tabs in the upper right corner to get information on how to use your current screen and where to go for more assistance.
3 If you need help getting started, check out our documentation on First Steps with WordPress. If you’d rather dive right in, here are a few things most people do first when they set up a new WordPress site. If you need help, use the Help tabs in the upper right corner to get information on how to use your current screen and where to go for more assistance.
1 If you need help getting started, check out our documentation on First Steps with WordPress. If you’d rather dive right in, here are a few things most people do first when they set up a new WordPress site. If you need help, use the Help tabs in the upper right corner to get information on how to use your current screen and where to go for more assistance.
2 If you need help getting started, check out our documentation on First Steps with WordPress. If you’d rather dive right in, here are a few things most people do first when they set up a new WordPress site. If you need help, use the Help tabs in the upper right corner to get information on how to use your current screen and where to go for more assistance.
3 If you need help getting started, check out our documentation on First Steps with WordPress. If you’d rather dive right in, here are a few things most people do first when they set up a new WordPress site. If you need help, use the Help tabs in the upper right corner to get information on how to use your current screen and where to go for more assistance.
Dividers
Divide the contents
Accordion
Accordion style
Item Title 1
If you need help getting started, check out our documentation on First Steps with WordPress. If you’d rather dive right in, here are a few things most people do first when they set up a new WordPress site. If you need help, use the Help tabs in the upper right corner to get information on how to use your current screen and where to go for more assistance.
Item Title 2
If you need help getting started, check out our documentation on First Steps with WordPress. If you’d rather dive right in, here are a few things most people do first when they set up a new WordPress site. If you need help, use the Help tabs in the upper right corner to get information on how to use your current screen and where to go for more assistance.
Item Title 3
If you need help getting started, check out our documentation on First Steps with WordPress. If you’d rather dive right in, here are a few things most people do first when they set up a new WordPress site. If you need help, use the Help tabs in the upper right corner to get information on how to use your current screen and where to go for more assistance.