The purpose of CSS is to allow the designer to define formatting details such as fonts, element sizes, and colors, and apply those formatting to HTML pages. Show below are some of the different methods to apply CSS.
lnline Styles
The simplest method of adding CSS styles to your web pages is to use inline styles. Its applied via style attribute. Inline style do not require selectors. All you need is only a style declaration. It clearly identifies the element to which the style is to be applied. See example below.
The disadvantage of this method is they can’t be reused. In another way, its means if you want to apply the style above to another p element, you will have to type it again in that element’s style attribute. This will also make the page difficult to maintain. Its because once you would like to change a particular thing ex. the color element, you will have to go through all the styles and change one by one.
Embedded Styles
This style uses style element to apply to your web page. You can declare any number of CSS styles by placing them between the opening and closing <style> tags. See example below.
The type attribute specifies the language that you’re using to define your styles. CSS is the only language in wide use at the time of writing, and is indicated with the value text/css.
One of the disadvantage is, if you want to use your predefined styles throughout your website, you’ll need to add the style code at the top of every pages. Hence, what I would suggest is to use the external style sheet.
External Style Sheets
An external style sheet is a file with the extension of .css. It contains all your predefined styles. You can link to this file by inserting the below code into you web pages. The benefit of creating this file is, when you make a change to any style on this .css file, it will affect all the pages that links to it. Then you won’t have to bother to change page by page.
This is the code to link your web pages to an external style sheet.
