Generic selectors
Exact matches only
Search in title
Search in content
Post Type Selectors

Basics of HTML

1. Basics of HTML

  • HyperText Markup Language: HTML provides the structure and content of web pages. It uses tags and attributes to define different elements like headings, paragraphs, images, and links.
  • Document Structure: An HTML document has a specific structure with a <!DOCTYPE> declaration, <html> tag, <head> section for information and <body> section for visible content.
  • Elements and Tags: Elements are building blocks defined by opening and closing tags (e.g., <p> for paragraph, <h1> for heading). Attributes provide additional details (e.g., class=”important”).

2. Formatting and Fonts

  • Headings: Use heading tags (<h1> to <h6>) for different levels of hierarchy.
  • Paragraphs and Text: <p> tag defines paragraphs, and inline elements like <strong> and <em> format text as bold and italic.
  • Fonts: Control font families, sizes, and styles using the font-familyfont-size, and font-style attributes.

3. Commenting Code

  • Use “ to add comments inside HTML code, visible only when editing the code but not displayed on the webpage.
  • Useful for explaining code sections or leaving notes for yourself or others.

4. Color

  • Define element colors using color attribute with hex codes (e.g., color="#ff0000" for red).
  • Can also use keywords like redgreenblue, etc.

5. Hyperlink

  • Create links with the <a> tag, referencing another web page with the href attribute (e.g., <a href="https://google.com">Visit Google</a>).
  • Can also link to different sections within the same webpage using anchor tags.

6. Lists

  • Ordered lists (<ol>) display numbered items, while unordered lists (<ul>) use bullet points.
  • Sub-lists and nested lists can be created for detailed organization.

7. Tables

  • Define tables with <table> tag, rows with <tr>, and columns with <td>.
  • Use table headers (<th>) for identifying column content.

8. Images

  • Add images with the <img> tag, specifying the image source with the src attribute (e.g., <img src="image.jpg">).
  • Use alt attribute for alternative text describing the image for accessibility.

9. Forms

  • Create forms for user input with form tag. Use input elements like <input type="text"> for text fields, <input type="radio"> for radio buttons, etc.
  • Forms capture user data and send it to the server for processing.