Linking Stylesheet
There are three types of CSS provided below:
• Inline CSS
• Internal or Embedded CSS
• External CSS
Inline CSS: Inline CSS contains CSS property in the body category linked to an element known as inline CSS. This type of style is specified within the HTML tag using a style attribute.
Example:
< ! DOCTYPE html >
< html >
< head >
< title > CSS inline < /title >
< /head >
< body >
< p style = "color: # 0000FF; font size: 50px;
font style: italics; text alignment: left; ">
SoftwareAdroit
< /p >
< /body >
< /html >
Internal or Embedded CSS: This can be used when a single HTML document needs to be styled specifically. The CSS rule set should be within the HTML file in the header section i.e. the CSS embedded within the HTML file.
Example:
< !DOCTYPE html >
< html >
< head >
< title >Internal CSS< /title >
< style >
.main {
text-align:left;
}
.SA {
color:#0000FF;
font-size:18px;
font-weight:bold;
}
.adroit {
font-style:bold;
font-size:18px;
}
< /style >
< /head >
< body >
< div class = "main" >
< div class =" SA " > SoftwareAdroit < /div >
< div class =" adroit " >
A programming learning website.
< /div >
< /div >
< /body >
< /html >
External CSS: External CSS contains a separate CSS file that contains style properties only with the help of tag marks (For example class, id, heading, … etc).. CSS assets are written in a separate file with the .css extension and must be linked to an HTML document using a link tag. This means that for each item, the style can only be set once and that will be applied to web pages.Ad Link
Example:
The file provided below contains CSS assets. This file ends with a .css extension. Ex: softwareadroit.css
body {
background-color:#000000;
}
.main {
text-align:left;
}
.SA {
color:#0000FF;
font-size:18px;
font-weight:bold;
}
#adroit {
font-style:bold;
font-size:18px;
}