Posts
The CSS is an abbreviation of Cascading Style Sheet. The style-sheet
is used to make web pages. It is used to make a table-less design. The
file extension of the css file is .css. There are three ways of
inserting style-sheet.
i. External style-sheet
ii. Internal style-sheet
iii. Inline style-sheet
External style-sheet:
An external style-sheet is ideal when the style is applied to many pages. With an external style-sheet, you change the look of an entire website by one file. Each page must link to the style-sheet using the <link> tag. The <link> tag goes inside the <head> section.
For example:
<head>
<link rel=”stylesheet” type=”test/css” href=”mystyle.css” />
</head>
Here, mystyle.css is a css file attached in the document.
Internal style-sheet:
An internal style-sheet can be used if one single document has a unique style. Internal styles are defined in the <head> section of an HTML page by using the <style> tag:
For example:
<head>
<style>
body {
background-color:blue;
}
</style>
</head>
Inline style:
An inline style can be used if a unique style is to be applied to one single occurrence of an element.
To use inline styles, use the style attribute in the relevant tag. The style attribute can contain any css property.
For example:
<p style=”color:blue; font-size:18px;”> This is a paragraph</p>
HTML Style Tags
<style> = Defines style information for a document.
<link> = Defines the relationship between a document and an external resourse.
The HTML head element
The head element is a container for all the head elements. Elements inside <head> can include scripts, instruct the browser where to find style sheet provide meta information and more.
The following tags can be added to the head section:
<title>, <base>, <link>, <meta>, <script> and <style>
i. External style-sheet
ii. Internal style-sheet
iii. Inline style-sheet
External style-sheet:
An external style-sheet is ideal when the style is applied to many pages. With an external style-sheet, you change the look of an entire website by one file. Each page must link to the style-sheet using the <link> tag. The <link> tag goes inside the <head> section.
For example:
<head>
<link rel=”stylesheet” type=”test/css” href=”mystyle.css” />
</head>
Here, mystyle.css is a css file attached in the document.
Internal style-sheet:
An internal style-sheet can be used if one single document has a unique style. Internal styles are defined in the <head> section of an HTML page by using the <style> tag:
For example:
<head>
<style>
body {
background-color:blue;
}
</style>
</head>
Inline style:
An inline style can be used if a unique style is to be applied to one single occurrence of an element.
To use inline styles, use the style attribute in the relevant tag. The style attribute can contain any css property.
For example:
<p style=”color:blue; font-size:18px;”> This is a paragraph</p>
HTML Style Tags
<style> = Defines style information for a document.
<link> = Defines the relationship between a document and an external resourse.
The HTML head element
The head element is a container for all the head elements. Elements inside <head> can include scripts, instruct the browser where to find style sheet provide meta information and more.
The following tags can be added to the head section:
<title>, <base>, <link>, <meta>, <script> and <style>
No comments:
Post a Comment