Jump to main content or area navigation.

Contact Us

EPAFiles: Web Design

Basic Template with Many HTML Examples and Tabs

Note: EPA no longer updates this information, but it may be useful as a reference or resource.

EPA builds all web content in the Drupal WebCMS as of January 2013. All new microsites and resource directories will be created using Drupal WebCMS. There is still content on EPA's legacy servers and this content will be maintained there until it is transformed and moved into the Drupal WebCMS. This information on styles and look and feel only applies to the existing content using Template 4 or older versions of EPA's template. Information for building new content is found in the EPA Web Guide.

This page is strictly a mockup for design purposes.

(Date: 2009-01-27) Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor sub text ut labore et sup text magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.


epaltsans Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

  • Unordered list test
  • Another list element. Lorem ipsum dolor sit amet, consectetur adipisicing elit.
  • Yet another element in the list
  • Some long text. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Top of Page


National Information

If you like, you can use paragraphs.

  • This box is the same as the first, excepting the header and bullet color

sample text goes here! Lots more text can fill this space. sample text goes here! Lots more text can fill this space. sample text goes here! Lots more text can fill this space.

Alert!
  • Float right
  • Width: fixed (218px)
  • Red bullets
Default Box

Regular text

  • Unordered list
  • Blue/green bullets
  1. Ordered list
  2. Numbers present
Centered Box, color1

Regular text

  • Unordered list
  • Blue/green bullets
  1. Ordered list
  2. Numbers present
Righted Box, color2

Regular text

  • Unordered list
  • Blue/green bullets
  1. Ordered list
  2. Numbers present

Top of Page


  1. Ordered list test
  2. Another list element
  3. Yet another element in the list
  1. Ordered list
  2. Here's a nested unordered list
    • Nested Unordered list
    • Nested ordered list
      1. The first
      2. And the second
  3. Ordered List item
  4. Nested Ordered list
    1. Some point
    2. Nested Unordered list
      • The first
      • And the second
definition list dt
definition list dd
definition list dt
definition list dd
Lorem ipsum dolor sit amet, consectetur adipisicing elit adipisicing elit adipisicing elit
Lorem ipsum dolor sit amet, consectetur adipisicing elit adipisicing elit adipisicing elit
Lorem ipsum dolor sit amet, consectetur adipisicing elit adipisicing elit adipisicing elit
Lorem ipsum dolor sit amet, consectetur adipisicing elit adipisicing elit adipisicing elit

Top of Page


H2: Lorem ipsum dolor sit amet, consectetur adipisicing elit adipisicing elit adipisicing elit

H3: Lorem ipsum dolor sit amet, consectetur adipisicing elit adipisicing elit adipisicing elit

H4: Lorem ipsum dolor sit amet, consectetur adipisicing elit adipisicing elit adipisicing elit

H5: Lorem ipsum dolor sit amet, consectetur adipisicing elit adipisicing elit adipisicing elit
H6: Lorem ipsum dolor sit amet, consectetur adipisicing elit adipisicing elit adipisicing elit

Heading 2

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Heading 3

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Heading 4

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Heading 5

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Heading 6

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Top of Page


playground

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.


Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Top of Page


<strong>, <b>
<del> deleted
<dfn> dfn
<em> emphasis, <i>

<a> anchor
<a> a + href
internal link | internal relative link | External gov link | External link Exit EPA Disclaimer

HomeEnd

<abbr> abbr - extended text when mouseover.
<acronym> acronym - extended text when mouseover.

<address>
Donald Duck
Box 555
Disneyland

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore dolore.

Top of Page


Archive icon changes.

Note: EPA no longer updates this information, but it may be useful as a reference or resource.

A table (class="table") with caption, tr, td, thead and tbody elements

Caption
Table Header One Table Header Two
TD One TD Two
TD One TD Two
TD One TD Two
TD One TD Two

A table (class="table zebra"; class="zebra" for striping) with caption, tr, td, thead and tbody elements

Caption
Table Header One Table Header Two
TD One TD Two
TD One TD Two
TD One TD Two
TD One TD Two

A table (class="tablebord zebra"; class="zebra" for striping) with caption, tr, td, thead and tbody elements

Caption
Table Header One Table Header Two
TD One TD Two
TD One TD Two
TD One TD Two
TD One TD Two

Top of Page


<pre>

pre  space1

pre  space1

pre    space2

pre    space2

pre	tab

pre	tab
<code>This code should be monospaced and wrap as if one line of text, even though the code has newlines, spaces, and tabs. Not indented indent1 indent1 indent2 indent3 <tt> This tt text should be monospaced and wrap as if one line of text even though the code has newlines, spaces, and tabs. It should be the same size as <p> text.

You will need Adobe Reader to view some of the files on this page. See EPA's PDF page to learn more.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore dolore.

Top of Page

Testing Column Layouts

Two Columns

Studies have shown that pharmaceuticals are present in our nation's waterbodies. Further research suggests that certain drugs may cause ecological harm. The EPA is committed to investigating this topic and developing strategies to help protect the health of both the environment and the public. To date, scientists have found no evidence of adverse human health effects from PPCPs in the environment.

PPCPs have probably been present in water and the environment for as long as humans have been using them. The drugs that we take are not entirely absorbed by our bodies, and are excreted and passed into wastewater and surface water. With advances in technology that improved the ability to detect and quantify these chemicals, we can now begin to identify what effects, if any, these chemicals have on human and environmental health.

This site is dedicated to the scientific issues associated with the occurrence of PPCPs in the environment.

Three Columns

Studies have shown that pharmaceuticals are present in our nation's waterbodies. Further research suggests that certain drugs may cause ecological harm. The EPA is committed to investigating this topic and developing strategies to help protect the health of both the environment and the public. To date, scientists have found no evidence of adverse human health effects from PPCPs in the environment.

PPCPs have probably been present in water and the environment for as long as humans have been using them. The drugs that we take are not entirely absorbed by our bodies, and are excreted and passed into wastewater and surface water. With advances in technology that improved the ability to detect and quantify these chemicals, we can now begin to identify what effects, if any, these chemicals have on human and environmental health.

Studies have shown that pharmaceuticals are present in our nation's waterbodies. Further research suggests that certain drugs may cause ecological harm. The EPA is committed to investigating this topic and developing strategies to help protect the health of both the environment and the public. To date, scientists have found no evidence of adverse human health effects from PPCPs in the environment.

PPCPs have probably been present in water and the environment for as long as humans have been using them. The drugs that we take are not entirely absorbed by our bodies, and are excreted and passed into wastewater and surface water. With advances in technology that improved the ability to detect and quantify these chemicals, we can now begin to identify what effects, if any, these chemicals have on human and environmental health.

This site is dedicated to the scientific issues associated with the occurrence of PPCPs in the environment.

Four Columns

Studies have shown that pharmaceuticals are present in our nation's waterbodies. Further research suggests that certain drugs may cause ecological harm. The EPA is committed to investigating this topic and developing strategies to help protect the health of both the environment and the public. To date, scientists have found no evidence of adverse human health effects from PPCPs in the environment.

PPCPs have probably been present in water and the environment for as long as humans have been using them. The drugs that we take are not entirely absorbed by our bodies, and are excreted and passed into wastewater and surface water. With advances in technology that improved the ability to detect and quantify these chemicals, we can now begin to identify what effects, if any, these chemicals have on human and environmental health.

Studies have shown that pharmaceuticals are present in our nation's waterbodies. Further research suggests that certain drugs may cause ecological harm. The EPA is committed to investigating this topic and developing strategies to help protect the health of both the environment and the public. To date, scientists have found no evidence of adverse human health effects from PPCPs in the environment.

PPCPs have probably been present in water and the environment for as long as humans have been using them. The drugs that we take are not entirely absorbed by our bodies, and are excreted and passed into wastewater and surface water. With advances in technology that improved the ability to detect and quantify these chemicals, we can now begin to identify what effects, if any, these chemicals have on human and environmental health.

Studies have shown that pharmaceuticals are present in our nation's waterbodies. Further research suggests that certain drugs may cause ecological harm. The EPA is committed to investigating this topic and developing strategies to help protect the health of both the environment and the public. To date, scientists have found no evidence of adverse human health effects from PPCPs in the environment.

PPCPs have probably been present in water and the environment for as long as humans have been using them. The drugs that we take are not entirely absorbed by our bodies, and are excreted and passed into wastewater and surface water. With advances in technology that improved the ability to detect and quantify these chemicals, we can now begin to identify what effects, if any, these chemicals have on human and environmental health.

This site is dedicated to the scientific issues associated with the occurrence of PPCPs in the environment.

Top of Page

For help with your epa.gov web design, contact the Web Template Workgroup.

Jump to main content.