The Cascading Style Sheets (CSS) are used for styling the web content and to help separate layout from presentation.

They can be added to HTML page in three ways:

The style element itself is used to add internal styles to the loaded page. Content between <style> tags is written in a language of Cascading Styles Sheets.

The attribute type defines the CSS content and it has to be set to "text/css".

Syntax:

<style type="text/css" /></style>

Attributes:

  • lang (language information), dir (text direction)
  • title (element title)
  • media (media descriptor)
  • type (content type)

Example

HTML style element:

​x
 
<html>
​
<head>
<title>HTML tutorial</title>
​
<style type="text/css">
body {
    width:90%;
    height:90%;
    background-color:gray;
    border:2px groove #cdd;
}
p {
    color:blue;
    background-color:yellow;
}
p#p_spec {
    color:red;
    font-weight:bold;
    background:none;
}
</style>
​
</head> 
​
<body>
​
<p>All paragraphs have blue fonts and are highlighted</p>
<p>All paragraphs have blue fonts and are highlighted</p>
<p>All paragraphs have blue fonts and are highlighted</p>
<p id="p_spec">Except this one!</p>
​
<hr />
​
<h5>Everything is styled with a style element inside the page's head section</h5>
​
</body>
​
</html>

 

›› go to examples ››