You can put your CSS rules into an HTML document using the <style> element. This tag is placed inside <head>…</head> tags.
Rules defined using this syntax will be applied to all elements available in the document.
Here is the generic syntax
Attributes associated with <style> elements are:
Attribute | Value | Description |
type | text/css | Specifies the style sheet language as a content –type (MIME type).This is required attribute. |
media | screen tty tv projection handheldprint braileaural all | Specifies the device the document will be displayed on. Default value is all. This is optional attribute. |
Example Following is the example of embed CSS based on above syntax:
You can use style attribute of any HTML element to define style rules. These rules will be applied to that element only. Here is the generic syntax:
Example Following is the example of inline CSS based on above syntax:
External CSS- The <link> Element: The <link> element can be used to include an external style sheet file in your HTML document. An external style sheet is a separate text file with .css extension . You define all the Style rules with in this text file and then you can include this file in any HTML document using<link> element.
Here is the generic syntax of including external CSS file:
Attributes associated with <style> elements are:
Attribute | Value | Description |
Type | text/css | Specifies the style sheet language as a content-type (MIME –type).This attribute is required. |
href | URL | Specifies the style sheet file having style rules .This attribute is a required. |
media | screen tty tv projection handheldprint braile aural all | Specifies the device the document will be displayed on. Default value is all. This is optional attribute. |
Example Consider a simple style sheet file with a name my style.css having the following rules:
Now you can include this file mystyle .css in any HTML document as follows:
You liked the article?
Like: 0
Vote for difficulty
Current difficulty (Avg): Medium
TekSlate is the best online training provider in delivering world-class IT skills to individuals and corporates from all parts of the globe. We are proven experts in accumulating every need of an IT skills upgrade aspirant and have delivered excellent services. We aim to bring you all the essentials to learn and master new technologies in the market with our articles, blogs, and videos. Build your career success with us, enhancing most in-demand skills in the market.