Basic HTML syntax
Elements, tags, attributes, void elements, doctype and correct nesting.
All lessons · HTML lessons: learn from scratch
Elements, tags and attributes
HTML marks up the parts of a page with tags. An element is an opening tag, content and a closing tag: <p>Hello</p>. The tag tells the browser “this text is a paragraph”.
An attribute gives an element extra information and is written in the opening tag as name="value". Some elements are empty and have no closing tag: <img>, <br>, <hr>, <input>.
<p class="note" lang="en">Hello, <strong>world</strong>!</p> <img src="logo.png" alt="Company logo"> <a href="https://example.com" target="_blank">Open</a>
The page skeleton
Every HTML document has the same skeleton: doctype, html, head and body. The head holds information about the page (title, encoding) and the body holds everything the visitor sees.
<!DOCTYPE html>
<html lang="az">
<head>
<meta charset="utf-8">
<title>İlk səhifəm</title>
</head>
<body>
<h1>Salam, dünya!</h1>
<p>Bu, mənim ilk səhifəmdir.</p>
</body>
</html>Writing rules
- Nest tags properly: <p><em>…</em></p>, not <p><em>…</p></em>.
- Put attribute values in quotes.
- Write tag names in lowercase.
- Write < and & in text as < and &.
A comment is written between <!-- ... --> and is not shown. The browser collapses spaces and line breaks into a single space, so use separate paragraphs instead of piling up <br>.