Scribd
Upload
3 views8 pages

HTML Cheatsheet - Coders_Section

This document is an HTML cheat sheet that outlines essential elements and structures for creating web pages. It covers topics such as boilerplate templates, headings, containers, text formatting, lists, media, tables, links, forms, semantic tags, and more. Additionally, it provides tips for beginners and emphasizes the importance of accessibility and responsive design.

Uploaded by

sankalandatta1234
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
3 views8 pages

HTML Cheatsheet - Coders_Section

This document is an HTML cheat sheet that outlines essential elements and structures for creating web pages. It covers topics such as boilerplate templates, headings, containers, text formatting, lists, media, tables, links, forms, semantic tags, and more. Additionally, it provides tips for beginners and emphasizes the importance of accessibility and responsive design.

Uploaded by

sankalandatta1234
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 8

HTML

CheatSheet
1. Boilerplate Template 🔥
The basic structure of every HTML page:

2. Headings 📢
Used to define headings from largest <h1> to smallest <h6>.

3. Containers 📦
Used to group or isolate parts of content.
<div> : Block-level container.
<span> : Inline-level container.
<p> : Paragraph.
<pre> : Preformatted text (keeps spaces/line breaks).
<code> : Displays code snippets.
Example:
4. Text Formatting Tags 📝
Used to stylize and structure your content.
<b>: Bold text (no importance).
<strong>: Bold + meaningful (important text).
<i>: Italics (no emphasis).
<em>: Italics + emphasized.
<sub>: Subscript.
<sup>: Superscript.
Example:

5. Lists📋
Ordered List (<ol>)
Numbered items.

Unordered List (<ul>)


Bulleted items.
6. Media 🖼️
Image :

Audio :

Video :

7. Tables 📊
Used to organize data in rows and columns.

8. Links 🔗
Creates a hyperlink.
9. Forms
Collects user input.

Form Elements:
Text: <input type="text">
Password: <input type="password">
Checkbox: <input type="checkbox">
Radio: <input type="radio">
Submit: <input type="submit">
Button: <button>Click</button>
Select: <select><option>One</option></select>
Textarea: <textarea>Text</textarea>
File: <input type="file">
Range: <input type="range">
Email: <input type="email">
URL: <input type="url">
Date: <input type="date">

10. Symbols & Characters 💡


Symbol Code

© Copyright &copy;

< Less &lt;

> Greater &gt;

& And &amp;

$ Dollar &dollar;
11. Semantic Tags
<section> – Defines a section.
<article> – Self-contained content.
<aside> – Sidebar.
<nav> – Navigation links.
<header> – Intro header.
<footer> – Page footer.
<main> – Main content.

12. Meta Tags (In <head>)


Provides metadata about the HTML document.

13. CSS Integration


Style your HTML page.
Internal CSS

External CSS

14. Accessibility
Always use alt for images.
Use <label> with for attributes:
15. Responsive Design
Make your site mobile-friendly.

16. JavaScript Integration


Inline Script

External Script

17. Comments
For developer notes (not displayed on screen):

18. Pro Tips for Beginners


Use “VS Code” or similar modern editors.
Learn Emmet (e.g., ul>li*5 → 5 list items).
Indent your code properly.
Always close your tags.
Pair HTML with CSS & JavaScript.
Use comments to explain your logic.
Practice regularly by building projects.
Was this post helpful ?

Follow For More


Tap Here

You might also like