1/16/25, 11:31 AM StackEdit
HTML CONCEPTS
HTML (HyperText Markup Language) is the standard language used to create and structure
content on the web. It forms the backbone of web development, allowing developers to
define elements such as headings, paragraphs, links, images, and more.
Key Concepts in HTML:
1. Elements and Tags: HTML documents are composed of elements, represented by
tags enclosed in angle brackets, e.g., <tagname> . Most elements have opening
( <tagname> ) and closing ( </tagname> ) tags, with content in between. Some
elements, known as void elements, are self-closing, like <br /> and <img /> .
2. Attributes: Attributes provide additional information about elements and are included
within the opening tag. They consist of a name and value pair, e.g., <a
href="https://www.example.com"> .
3. Document Structure: A basic HTML document includes:
<!DOCTYPE html> declaration to specify the HTML version.
<html> element as the root.
<head> section containing metadata, such as <title> , <meta> , and links to
stylesheets.
<body> section containing the content to be displayed on the webpage.
4. Headings and Paragraphs: Headings are defined with <h1> to <h6> tags, with <h1>
being the highest level. Paragraphs are defined with the <p> tag.
5. Links and Images: Hyperlinks are created using the <a> tag with the href attribute,
e.g., <a href="https://www.example.com">Link</a> . Images are embedded using
the <img> tag with src and alt attributes, e.g., <img src="image.jpg"
alt="Description"> .
6. Lists: HTML supports ordered lists ( <ol> ), unordered lists ( <ul> ), and definition lists
( <dl> ) to organize content.
https://stackedit.io/app# 1/8
1/16/25, 11:31 AM StackEdit
7. Tables: Tables are created using the <table> tag, with <tr> for table rows, <th> for
headers, and <td> for data cells.
8. Forms: Forms collect user input and are defined with the <form> tag, containing
form elements like <input> , <textarea> , <button> , and <select> .
9. Semantic Elements: HTML5 introduced semantic elements like <header> ,
<footer> , <article> , and <section> to provide meaningful structure to web
documents.
10. Multimedia: HTML5 provides <audio> and <video> tags to embed media content
directly into web pages.
Understanding these foundational concepts is crucial for anyone beginning their journey in
web development.
HTML INTERVIEW QUESTIONS
1. What is HTML?
HTML (HyperText Markup Language) is the standard language used to create and structure
web pages. It defines the content of a webpage using elements represented by tags like
<p> , <h1> , and <a> .
2. What are HTML elements and tags?
HTML Elements: They define the structure and content, e.g., <p>This is a
paragraph.</p> .
Tags: Markup keywords enclosed in angle brackets, e.g., <html> . Tags can be:
Opening Tag: <p>
Closing Tag: </p>
Self-Closing Tag: <img />
https://stackedit.io/app# 2/8
1/16/25, 11:31 AM StackEdit
3. What is the purpose of the <!DOCTYPE> declaration?
The <!DOCTYPE> declaration informs the browser about the version of HTML being used.
For example:
<!DOCTYPE html>
This declares the document as HTML5.
4. What are attributes in HTML?
Attributes provide additional information about an element. They are written in the opening
tag and usually come as name-value pairs, e.g.:
<a href="https://www.example.com">Visit Example</a>
5. What is the difference between block-level and inline elements?
Block-Level Elements: Take up the full width of their container, starting on a new line
(e.g., <div> , <p> , <h1> ).
Inline Elements: Take up only as much width as needed and remain in line with other
content (e.g., <span> , <a> , <img> ).
6. What are semantic elements in HTML?
Semantic elements clearly define their meaning to browsers and developers, e.g.:
<header> : Defines a page header.
<footer> : Defines a footer for a page.
<article> : Defines self-contained content.
https://stackedit.io/app# 3/8
1/16/25, 11:31 AM StackEdit
<section> : Groups related content.
7. What is the difference between <div> and <span> ?
<div> : A block-level container used for layout and styling.
<span> : An inline container used for styling specific parts of text.
8. What is the difference between <ol> and <ul> ?
<ol> : Creates an ordered (numbered) list.
<ul> : Creates an unordered (bulleted) list.
9. How are images added to a webpage in HTML?
Using the <img> tag with src (source) and alt (alternate text) attributes:
<img src="image.jpg" alt="Description of the image">
10. What is the <a> tag used for?
The <a> tag creates hyperlinks. It requires the href attribute to specify the URL:
<a href="https://www.example.com">Visit Example</a>
11. What are HTML forms?
https://stackedit.io/app# 4/8
1/16/25, 11:31 AM StackEdit
Forms collect user input and send it to a server. Example:
<form action="/submit" method="POST">
<input type="text" name="username" placeholder="Enter Username">
<button type="submit">Submit</button>
</form>
12. What is the purpose of the <meta> tag?
The <meta> tag provides metadata about the HTML document, such as:
Character encoding: <meta charset="UTF-8">
Description: <meta name="description" content="Learn HTML">
13. What are void elements in HTML?
Void elements are self-closing and do not have a closing tag. Examples:
<img />
<br />
<input />
14. What is the difference between <iframe> and <embed> ?
<iframe> : Embeds another HTML page into the current one.
<embed> : Embeds external content like videos or PDFs.
15. What are global attributes in HTML?
Global attributes can be applied to any HTML element. Examples:
https://stackedit.io/app# 5/8
1/16/25, 11:31 AM StackEdit
id
class
style
title
16. What is the purpose of the <head> section in HTML?
The <head> contains metadata, links to stylesheets, and other resources. It does not
display content on the webpage. Example:
<head>
<title>My Page</title>
<link rel="stylesheet" href="styles.css">
</head>
17. What is the role of the <script> tag in HTML?
The <script> tag is used to embed or link JavaScript code.
<script src="app.js"></script>
18. What are inline, internal, and external CSS in HTML?
Inline CSS: Applied directly to elements using the style attribute.
Internal CSS: Written in the <style> tag inside the <head> section.
External CSS: Linked via <link> tag.
19. What is the difference between the id and class attributes?
https://stackedit.io/app# 6/8
1/16/25, 11:31 AM StackEdit
id : A unique identifier for a single element.
class : A reusable identifier for multiple elements.
20. What is the <table> tag used for?
The <table> tag is used to create tables. Example:
<table>
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>John</td>
<td>30</td>
</tr>
</table>
21. How can you include comments in HTML?
Use <!-- and --> to write comments that won’t be displayed:
<!-- This is a comment -->
22. What is the purpose of the <link> tag?
The <link> tag links external resources like CSS files to the document:
<link rel="stylesheet" href="styles.css">
https://stackedit.io/app# 7/8
1/16/25, 11:31 AM StackEdit
23. What is the purpose of the <noscript> tag?
The <noscript> tag provides fallback content for users who have disabled JavaScript.
24. How do you embed a video in HTML?
Using the <video> tag:
<video controls>
<source src="video.mp4" type="video/mp4">
</video>
25. What is the difference between relative and absolute URLs?
Relative URL: Relative to the document location, e.g., images/pic.jpg .
Absolute URL: Full URL including domain, e.g.,
https://www.example.com/images/pic.jpg .
https://stackedit.io/app# 8/8
