Types of CSS in HTML


Example of different types of CSS  in html:-

1) Inline:-

<p style="color:blue; font-family: Arial,Helvetica,Sans-serif; font-size: 14px;">Hi there! I'm styled with an INLINE style</p>

2) Internal Style Sheet:-


<head>
<style type="text/css">
<!--
.red {
color: #CE1A30;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
}
-->
</style>
</head>

<body>
...
<p class="red">Hi there! I'm styled with an embedded, or INTERNAL style sheet!</p>
</body>

3)
External or Attached Style SHeet:-

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

<p class="greenText">Oh hello! I'm styled with an EXTERNAL, or attached style sheet!</p>



NOTE:- Use of inline CSS:- interesting

Although inline styles are part of CSS, they are used infrequently. They present many
of the same problems as the older <font> tags in HTML. They only apply to one tag
at a time and are not easily reusable. So when are they used? Inline styles are useful
when an internal or external style sheet may not be available; a good example of this is
HTML-based e-mail. They are also used in certain situations to override other styles.

---------------------------


Till Next time,
Adios





No comments:

Post a Comment