Tuesday, 12 July 2016

Internal CSS | How to use Internal CSS in HTML Web page

Here is the Steps to apply Internal CSS in your web page for single HTML page:

1. Internal CSS is used to apply Style to single Html Page or Web page.
Internal CSS
2.For define Internal CSS in Html page you have to insert style( <style> </style>) tags within the head(<head>) tags.

For Example:
<head> <style></style> </head> 

  3.In between these style tags, you can define a style for different tags and items for your HTML page.
Internal CSS Example:
<style> h1{font-size:150%;} </style>

In the above example, we apply font-size to heading tag with help of Internal CSS. We can apply a different style to different items with help of Internal CSS on your Html web page.
4.If you are using div(<div>) tags in your Html page ,so in this situation, we can also use id,class to apply CSS.


Internal CSS
Example:
using class: <style> .img{width:500px;}</style>

using id: <style> #img{width:500px;}</style>
Internal CSS
Example Internal CSS:
<!DOCTYPE html>
<html>
    <head>
          <title>Internal CSS </title>
 <style>
h1
{
font-size:250%;
color:red;
}
.small{
color:blue;
font-size:350%;
}
#large{
color:brown;
font-size:450%;
}
 </style>
    </head>
    <body>
<h1>Hello Everyone</h1> 
<div class="small">Internal CSS with Class element</div>
<div id="large">Internal CSS with ID element</div>
    </body>

</html>
Internal CSS
The output is shown below:-
Internal CSS
Internal CSS
Internal CSS

No comments:

Post a Comment

Leave a Reply!