Embedded Style Sheets

Embedded Style Sheets refer to when you embed style sheet information into an HTML document using the <style> element. You do this by embedding the style sheet information within <style></style> tags in the head of your document.

Syntax

The CSS syntax for embedded style sheets is exactly the same as other CSS code.

For example, to use the following code, simply place it between the <head></head> tags of your HTML document:

Copy to Clipboard
<style type="text/css" media=screen>
   p {font-family: georgia, serif; font-size: x-small;}
   hr {color: #ff9900; height: 1px }
   a:hover {color: #ff0000; text-decoration: none}
</style>

Now, whenever any of those elements are used within the body of the document, they will be formatted as instructed in the above style sheet.

Example

Modify the code below, then click "Update". See below for attributes.

Source CodeResult

Embedded style sheets are suited for documents with unique design requirements. If the styles need to be applied across muliple documents, you should link to an external style sheet instead of using an embedded style sheet.

Enjoy this page?

Sponsored Link: Design CODE-FREE Websites

Check a Domain:

ZappyHost Logo
Webydo Banner Ad