How to style your HTML page
Oh so you have a HTML web page and now you want to give it a good look by adding colors and other effects. Not bad not bad, you should give it color because style is the clothes of the HTML pages.
Here I am going to tell you that how you can give a style to your web pages.
1. Create a text file with css extension like “Style.css” in the same folder of your webpage.
2. Open your webpage in the editor you are using.
3. Put the following line in the header of your HTML page.
<link href=’style.css’ rel=’stylesheet’ type=”text/css” />
4. Mention Classes and IDs of your objects in the HTML page and then put CSS properties by using CSS syntax.
For example if I have a heading in HTML page and I want to color it then I will do this.
Color:white;
Background:red;
}
We write “class” property as a name of the object and then we put dot in the css file to refer that object.
Tell me in comments if you have are facing any problem. I will write in more details if you are facing any issue or did not understand it.
Oh so you have a HTML web page and now you want to give it a good look by adding colors and other effects. Not bad not bad, you should give it color because style is the clothes of the HTML pages.
Here I am going to tell you that how you can give a style to your web pages.
1. Create a text file with css extension like “Style.css” in the same folder of your webpage.
2. Open your webpage in the editor you are using.
3. Put the following line in the header of your HTML page.
<link href=’style.css’ rel=’stylesheet’ type=”text/css” />
4. Mention Classes and IDs of your objects in the HTML page and then put CSS properties by using CSS syntax.
For example if I have a heading in HTML page and I want to color it then I will do this.
In the HTML page,
<h2 class=’myheading’>This is heading text </h2>And then in the css file
.myheading{Color:white;
Background:red;
}
We write “class” property as a name of the object and then we put dot in the css file to refer that object.
Tell me in comments if you have are facing any problem. I will write in more details if you are facing any issue or did not understand it.
0 comments:
Post a Comment