the web workshop

An embedded style is added directly into a HTML file

The style is placed in the head element

Looks like:

<style type="text/css">
<!--
h1 {
         color:red;
         text-align:center;
}
-->
</style>

Directions:

  1. Embedded styles always start with the style tags
    <style type="test/css"> ... </style>
  2. You may recognize the next HTML
    <!--   --> is a comment.
    It was originally created as a quick fix for browsers that don't read styles.
  3. Inside the comment, enter the style rule

This new rule will effect the presentation of all the content inside any and all h1 tags on the web page(s) the embedded style resides in.

feetSteps to Success

  1. Add the following markup inside the head element
    <style type="text/css">
    <!--
    h1 {
        color:red;
        text-align:center;
    }
    -->
    </style>
  2. Add another h1 inside the <body> element.
    <h1>This is my 2nd heading. It should also be red. Every h1 on this page will now be red. </h1>
  3. Save and preview in a browser.

This workshop is brought to you by jdwwebdesign.com

Please feel free to contact us with any comments and/or concerns about this workshop