Types of CSS

 TYPES OF CSS

- Inline CSS

- Multi Line CSS

- Internal CSS

- External CSS

________________________________________

INLINE CSS : 

An inline CSS is used to apply a unique style to a single HTML tag or element.

Syntax: <tag style="attribute:value">-----</tag>

Example:

    <p style="color:red;">welcome 123</p>

    <h2 style="background-color:yellow;">hello this is a INline Style</h2>

_______________________________________________

MULTI-LINE CSS : 

An Multi Line CSS is used to apply a unique style to a single HTML tag or element with Multiple CSS Attributes or Properties.

Syntax: <tag style="attribute:value; attribute:value;">------</tag>

Example :

    <p style="color:white; background-color:black;">Welcome 111</p>

    <a href="" style="color:orange; background-color:maroon; padding:10px; text-                            decoration:none;">Home</a>

_________________________________________________

INTERNAL CSS:

internal CSS is used to define a style for a single HTML page. within a <style> element

Syntax:

    <style>

            ----- css coding ----

    </style>

Example:

<style>

p

{

color:red;

}

h1{ color:yellow; background-color:black;}

b

{

color:green; 

background-color:pink;

font-size:30px;

padding:12px;

}

a{color:white; background-color:black; padding:10px; font-family:'Bauhaus 93'; text-decoration:none;}

</style>

<a href="">Home</a> &nbsp;&nbsp;&nbsp;&nbsp;<a href="">Contact Us</a><br><br><br><br>

<b>youtube.com/avadhtutor</b>

<h3>Learn All Programming</h3>

<p>AVADH TUTOR</p>

<h4>Internal</h4>

<h1> CSS</h1>

________________________________________

External CSS: 

this style sheet  you can change the look of an entire website by changing just one file, External CSS hash two files one is create with extension .css and another file with extension .html

Example:

Create File : external.css

    body{ background-color:orange; }

    p{ color:blue; font-size:21px; font-family:'Britannic'; }

    h1{ background-color:yellow; }

Create File : simple.html

    <link href="external.css" type="text/css" rel="stylesheet">

    youtube.com/avadhtutor

    <h1>External StyleSheet</h1>

    <p>This is Simple Example</p>

_________________________

Learn All Programming and Scripting Languages with youtube.com/avadhtutor

Learn HTML For beginners : https://www.youtube.com/watch?v=oxIsm512PdM&list=PLkx9f4H3tJMKHviDIr-BsBd_h2dVtWWf5

Learn CSS For Beginners: https://www.youtube.com/watch?v=tJWtvmRanOc&list=PLkx9f4H3tJMKDiznW8Zus-4-N0mWlfkiB

Learn CSS3 For Beginners: https://www.youtube.com/watch?v=EHczBXp-cmc&list=PLkx9f4H3tJMJ2xk5lOUsfpexF0IH3_sOA