Introduction to HTML – Part 1
HTML (Hyper Text Markup Language) is the core of designing websites. Part one of this introduction covers the difference between HTML and CSS, a simple HTML page, and Paragraphs/Line Breaks/Headings.
Envato Elements gives you unlimited access to 2 million+ pro design resources, themes, templates, photos, graphics and more. Everything you'll ever need in your design resource toolkit.
Logos, Print & Mockups
PowerPoint & Keynote
Shopify, Tumblr & More
HTML and CSS – The difference
Think of HTML as the structure of the website you are making. It will contain the text, images and links – all put in the correct order – to compose the page that you want to display. CSS is the look and feel of the page. In your CSS you define the colours, fonts, backgrounds and borders surrounding the content you have in your HTML file. We explain below how to attach your CSS file to your HTML file, but read our CSS tutorials for more information on that topic.
A simple HTML page
The best way to learn is by doing, so the following are a few examples of HTML in action. This is, at it’s simplest, a HTML page:
<link rel="stylesheet" type="text/css" href="style.css" />
That’s it – it’s much more straight forward than you would expect. HTML works on a system of tags, with each one surrounded by brackets. Any tag that you open must be closed. This can be done as above with a seperate opening and closing tag (i.e.