HTML Elements (No Sidebars Template)

This is an example of HTML Elements(aka the Cheat Sheet) as used in the No Sidebars Page Template layout.

Use this site’s Customizer to see alternate Navigation arrangements.
(id-demos Examples: Default, Side Nav, Top Nav, No Nav, Child)

Text Alignment: Left

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis.

Text Alignment: Center

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra.

Text Alignment: Right

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.  Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6
Preformatted Text

Bold

Italic

Underline

Strikethrough

This is a link.

Base Button

Button Primary

Button Secondary

Code


#header h1 a {
display: block;
width: 300px;
height: 80px;
}

I am the a tag example
I am the abbr tag example

I am the acronym tag example
I am the b tag example
I am the big tag example

I am the cite tag example
I am the code tag example
I am the del tag example

I am the s tag example (deprecated tag – use del instead)
I am the strike tag example (deprecated tag – use del instead)

I am the dfn tag example
I am the em tag example
I am the i tag example

I am the ins tag example
I am the kbd tag example
I am the q tag inside a q tag example

I am the samp tag example
I am the small tag example
I am the span tag example

I am the strong tag example
I am the sub tag example
I am the sup tag example

I am the tt tag example
I am the var tag example
I am the small class example

I am the large class example
I am the highlight class example

Example Section Area

Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vestibulum id ligula porta felis euismod semper.

BU Callouts

Big Sur
Cras mattis consectetur purus sit amet fermentum.

Announcement Box

This is content inside of the announcement box. All styles and headings work inside of the announcement box!

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra.

Big Sur
Cras mattis consectetur purus sit amet fermentum.

Announcement Box

This is content inside of the announcement box. All styles and headings work inside of the announcement box!

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat.

Big Sur
Cras mattis consectetur purus sit amet fermentum.

Announcement Box

This is content inside of the announcement box. All styles and headings work inside of the announcement box!

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat.

Nullam id dolor id nibh ultricies vehicula ut id elit. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec id elit non mi porta gravida at eget metus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper nulla non metus auctor fringilla. Curabitur blandit tempus porttitor.

Blockquotes

Pullquote (figure element class=”quote”)

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper.

Name Ipsum

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper.

Horizontal Rule

Lists

Unordered List
  • Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.
    • Sub-item
    • Sub-item
      • Sub-sub-item
  • Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.
  • Phasellus ultrices nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. Nam nulla quam, gravida non, commodo a, sodales sit amet, nisi.
  • Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.
Ordered List
  1. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
    1. Vestibulum auctor dapibus neque.
    2. Vestibulum auctor dapibus neque.
      1. Vestibulum auctor dapibus neque.
    3. Vestibulum auctor dapibus neque.
    4. Vestibulum auctor dapibus neque.
  2. Aliquam tincidunt mauris eu risus.
  3. Vestibulum auctor dapibus neque.

Tables

Sortable
Season Fall Winter Spring Summer
Description Also known as autumn, fall in New England is famous for the landscape of bright reds, oranges, and yellows as the leaves change color. Often brings very cold temperatures and snowstorms. Weather becomes milder towards April; days become longer and flowers bloom. Frequent rainfall and strong winds are common. Often very hot and humid, especially in the middle of the season.
Apparel Light jackets, scarves, sweaters; switching to hats and heavier jackets later in the season Heavy coats, all-weather boots, scarves, gloves, and hats Coats, sweaters, hats, and scarves early in the season, lighter apparel and rain gear as temperatures warm up Lightweight clothing and sun protection
Months mid-Sept.–late Nov. Dec.–late March late March–mid June mid-June–mid-Sept.
Average Temp. 46–60° F/
8–15° C		 0–37° F/
-17–3° C		 38–60° F/
3–15° C		 60–95° F/
15–35° C
Striped
Season Fall Winter Spring Summer
Description Also known as autumn, fall in New England is famous for the landscape of bright reds, oranges, and yellows as the leaves change color. Often brings very cold temperatures and snowstorms. Weather becomes milder towards April; days become longer and flowers bloom. Frequent rainfall and strong winds are common. Often very hot and humid, especially in the middle of the season.
Apparel Light jackets, scarves, sweaters; switching to hats and heavier jackets later in the season Heavy coats, all-weather boots, scarves, gloves, and hats Coats, sweaters, hats, and scarves early in the season, lighter apparel and rain gear as temperatures warm up Lightweight clothing and sun protection
Months mid-Sept.–late Nov. Dec.–late March late March–mid June mid-June–mid-Sept.
Average Temp. 46–60° F/
8–15° C		 0–37° F/
-17–3° C		 38–60° F/
3–15° C		 60–95° F/
15–35° C
Bordered
Season Fall Winter Spring Summer
Description Also known as autumn, fall in New England is famous for the landscape of bright reds, oranges, and yellows as the leaves change color. Often brings very cold temperatures and snowstorms. Weather becomes milder towards April; days become longer and flowers bloom. Frequent rainfall and strong winds are common. Often very hot and humid, especially in the middle of the season.
Apparel Light jackets, scarves, sweaters; switching to hats and heavier jackets later in the season Heavy coats, all-weather boots, scarves, gloves, and hats Coats, sweaters, hats, and scarves early in the season, lighter apparel and rain gear as temperatures warm up Lightweight clothing and sun protection
Months mid-Sept.–late Nov. Dec.–late March late March–mid June mid-June–mid-Sept.
Average Temp. 46–60° F/
8–15° C		 0–37° F/
-17–3° C		 38–60° F/
3–15° C		 60–95° F/
15–35° C
Responsive Table Wrapper
Season Fall Winter Spring Summer
Description Also known as autumn, fall in New England is famous for the landscape of bright reds, oranges, and yellows as the leaves change color. Often brings very cold temperatures and snowstorms. Weather becomes milder towards April; days become longer and flowers bloom. Frequent rainfall and strong winds are common. Often very hot and humid, especially in the middle of the season.
Apparel Light jackets, scarves, sweaters; switching to hats and heavier jackets later in the season Heavy coats, all-weather boots, scarves, gloves, and hats Coats, sweaters, hats, and scarves early in the season, lighter apparel and rain gear as temperatures warm up Lightweight clothing and sun protection
Months mid-Sept.–late Nov. Dec.–late March late March–mid June mid-June–mid-Sept.
Average Temp. 46–60° F/
8–15° C		 0–37° F/
-17–3° C		 38–60° F/
3–15° C		 60–95° F/
15–35° C
Single Row Custom Table
Vestibulum in mauris semper tortor interdum ultrices. Vestibulum in mauris semper tortor interdum ultrices. Vestibulum in mauris semper tortor interdum ultrices.
  • Vestibulum in mauris semper tortor interdum ultrices
Custom Table (Without thead, tfoot or tbody)
Table Caption (Unstyled Table without thead, tfoot, or tbody)
Table row – header <tr><th> Table row – header Table row – header
Table row – regular <tr><td> Table row – regular Table row – regular
Table row – regular Table row – regular Table row – regular
Table row – regular Table row – regular Table row – regular

Note: If you use the thead, tfoot and tbody elements, you must use every element. They should appear in this order: <thead>, <tfoot> and <tbody>, so that browsers can render the foot before receiving all the data. You must use these tags within the table element. Each requires a <tr> tag and <td> or <th> tags for each cell. See the source code of the table above for an example.

BU Slideshow Example

loading slideshow...

  • Nullam Malesuada Mattis Vestibulum

  • Etiam Fermentum Ultricies

    Etiam porta sem malesuada magna mollis euismod. Nullam quis risus eget urna mollis ornare vel eu leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

  • Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nullam quis risus eget urna mollis ornare vel eu leo.

Visit techweb for further documentation and parameters for the BU Slideshow Plugin.

Image Alignment, Layout

Image Alignment: None

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus

Image Alignment: Left

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus

Image Alignment: Center

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra.

Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus

Image Alignment: Right

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus

Image with caption
Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec id elit non mi porta gravida at eget metus.

Gallery

Collapsibles

Collapsible Title, Heading 1







Forms

Forms with Everything: Top Aligned

We would love to hear from you! Please fill out this form and we will get in touch with you shortly.

  • Aliquam erat volutpat. Maecenas nec posuere lectus. Donec rutrum, ante vel ullamcorper cursus, lorem.
  • Aliquam erat volutpat. Maecenas nec posuere lectus. Donec rutrum, ante vel ullamcorper cursus, lorem.

  • Section Break

  • MM slash DD slash YYYY
  • :
  • Max. file size: 100 MB.

  • Separate tags with commas

  • Accepted file types: jpg, jpeg, png, gif.