Different ways to integrate a CSS into a Web page

There are three ways to integrate CSS into a Web page

a.) Inline: HTML elements may have CSS applied to them via the STYLE attribute.


  • Internal Styles Cannot be reused at all,period. Inline styles are placed directly inside an HTML element in the code.


<p style=”padding-left: 150px;”>LORUM IPSUM </p>

b.) Internal / Embedded: By placing the code in a STYLE element within the HEAD element.


  • These styles can be used only for webpage in which they are embedded.
  • Therfore, you would need to create these styles over and over again for each webpage you wish to style.


    background-color: linen;

h1 {
    color: maroon;
    margin-left: 40px;

c.)External: Place the CSS in an external file and link it via a link element.


  • An External Style sheet is a separate file which is then linked to the web page.
  • The External Style Sheet is basically a text file that is saved as a .css file.
  • we place the link in the <head> section of the page.


<link href=”main.css” rel=”stylesheet” type=”text/css”>

Posted in Css

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s