Hey there reader! Ever wondered how you can read this article? Or how this article has been created and made available on this webpage? This is made possible using HTML or hypertext markup language, which is a standard markup language for creating Web Pages.
Using HTML our web browser displays our web pages. With HTML anyone today can create a webpage. However, for a commercial website, it is understood that one or two web pages aren’t enough. In fact, for a successful commercial website to work, we need hundreds of web pages. Here CSS comes to the rescue.
CSS saves us a lot of work as it can control multiple webpages at a time. CSS is what helps make web pages different from one another by formatting their layout. These two languages along with Javascript are the three main building blocks of web development.
HTML vs CSS
These two appear to be pretty similar, so what is the reason we use these two different. The comparison table given below should give us an idea about it.
HTML | CSS |
It stands for Hypertext markup language. | It stands for Cascading Style Sheets. |
HTML is used to create and provide the structure of the web page. | CSS provides the layout and style of the web page |
A markup language with a text-based approach to creating web pages. | A style sheet language to format a web page. |
Consists of tags to display content | Consists of selectors followed by a declaration block |
CSS can be used in HTML file | HTML can not be used in a CSS file |
File extension- .html | File extension- .css |
HTML does not have further types or defined method | CSS can be used internally or externally to code |
Let’s find out more in detail about HTML and CSS.
What is HTML?
HTML, an abbreviation for Hypertext markup language, was created in 1990 by Tim Berners-Lee. It is the most commonly used scripting language to create a webpage and is the basic building block of webpages.
HTML is a text-based approach used in displaying content on a web page. HTML files can be simply created on a notepad, saved with a .html extension and executed on the browser.
The web browser reads an HTML file and uses it to interpret and then displays a web page on the world wide web. It reads the tags in the HTML file and accordingly formats the headings, paragraphs, images, tables and other elements are given thus providing the basic anatomy of the web page.
There are various versions of HTML as HTML 1, 2, up to HTML 5 which is the latest version.
The HTML file starts with the Document type declaration which specifies the version of HTML. The file must start with <html> (with angular brackets) and end with </html> mandatorily. Most tags come in pairs and have a start and end tag. It has two sections named head and body section.
The head section contains the details of the file like the title while the body contains the tags required to make the content visible. A web page developed using only HTML is static. HTML has many features such as video and audio support, geolocation. HTML is the interface for web and mobile applications.
What is CSS?
CSS is used to format the layout of web pages and can control multiple webpages at a time as well. It is the most common scripting language used to format already created web pages in the markup language.
HTML files were allowed to have options to format the web page, but this was an extremely tedious task. It was difficult to format web pages and so CSS was created by the World Wide Web Consortium. It allowed creating a separate CSS file where all formatting was stored and this could be used for many pages at a time.
CSS helps to make the already structured web page more stylish and presentable to users. CSS allows us to control the fonts, icons, background images and audios, background colour, etc. and more designs. It allows you to add gradients, shadows and borders as well.
CSS also allows the web page to be formatted according to different devices and their layouts. CSS is independent of HTML and can also be used with any XML files.
CSS is written inside HTML or added as an external tag. The CSS declarations have two sections called property followed by a value, they are separated by a colon. There are various versions of CSS as well. Beginning from CSS 1, the oldest version used as a simple formatting model for all the HTML tags, then CSS 2 contains additional features which are more media-specific styles. The latest version is CSS3 which has selectors, box models, transforms etc. CSS is now accepted by all browsers.
Author
Shriya Upasani
MIT World Peace University