Difference between CSS and HTML
Previous Home Next

HTML is the hypertext markup language we can also make formatting text with HTML for example making a text bold in html.

<b> This is text for HTML </b>

Another disadvantage can be found in this example:- if you wanted to make the above text bold, make the font style Verdana and change its color to red, you would need a lot of code wrapped around the text.

<font color="#FF0000" face="Verdana, Arial,  Helvetica, sans-serif">
<strong>This is  text for HTML</strong></font>

This is verbose and contributes to making your HTML messy. With CSS, you can create a custom style elsewhere and set all its properties, give it a unique name and then ‘tag’ your HTML to apply these stylistic properties. And in between the tags at the top of your web page you would insert this CSS code that defines the style we just applied:

<style type="text/css">
.myNewStyle {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
color: #FF0000;


In the above example we embed the css code directly into the page itself. This is fine for smaller projects or in situations where the styles you’re defining will only be used in a single page. There are many times when you will be applying your styles to many pages and it would be a hassle to have to copy and paste your CSS code into each page.

You also find yourself having to edit each of these pages if you want to make a style change. Like with JavaScript,you can define/create your CSS styles in a separate file and then link it to the page you want to apply the code to-

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

The above line of code links your external style sheet called ‘myFirstStyleSheet.css’ to the HTML document. You place this code in between the <head> </head> tags in your web page.

Previous Home Next