CSS How-To
When a browser reads a style sheet, it will format the HTML document according to the information in the style sheet. There are three types of CSS which are given below:
1. Internal or Embedded CSS
2. External CSS
3. Inline CSS
Internal CSS:
In internal CSS the style of CSS is specified in the <head> section within <style> element. This can be used when a single HTML document must be styled uniquely. The CSS ruleset should be within the HTML file in the head section i.e the CSS is embedded within the HTML file.
CODE:
Result:
External CSS:
In External CSS we create a .css file and use it in our HTML page as per our requirements. Generally, external Cascading Style Sheets are used whenever we have many HTML attributes and we can use them as required; there is no need to rewrite the CSS style again and again in a complete body of HTML that inherits the property of the CSS file. The external .css file should not contain any HTML tags.
CODE:
Here is an external CSS we create as an external.css file.
Result:
Inline CSS:
For Inline CSS every style content is in HTML elements. It is used for a limited section. Whenever our requirements are very small we can use inline CSS. It will affect only single elements. In HTML we require that various HTML tag’s views are different so then we use inline Cascading Style Sheets.
CODE:
Result:
You may also like: CSS Selectors