0% found this document useful (0 votes)
33 views

HTML Sunny

Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
33 views

HTML Sunny

Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 13

HTML Interview Questions

1) What is HTML ?
HTML stands for Hypertext Markup Language. It's the standard markup language used for creating
web pages and web applications. HTML provides the structure and layout of content on a web
page by using a system of tags and attributes to define elements such as headings, paragraphs,
links, images, and more.
2) Are the HTML tags and elements the same thing?
HTML tags are like markers indicating how content should be displayed. Elements are the actual
content enclosed within those markers. For instance, <p> is a tag marking the start of a paragraph
element, while the text within the <p> and </p> tags constitutes the element itself.

3) What are void elements in HTML?

HTML elements which do not have closing tags or do not need to be closed are Void elements. For
Example <br />, <img />, <hr />, etc.

4) What is the advantage of collapsing white space?

Collapsing white space in HTML is beneficial for improving readability and managing layout
consistency on web pages. When browsers render HTML, they typically collapse consecutive
white space characters (such as spaces, tabs, and line breaks) into a single space.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Collapsing White Space Example</title>
</head>
<body>
<p>This is a paragraph with extra white space.</p>
</body>
</html>
5. What are HTML Entities?

In HTML some characters are reserved like ‘<’, ‘>’, ‘/’, etc. To use these characters in our
webpage we need to use the character entities called HTML Entities. Below are a few mapping
between the reserved character and its respective entity character to be used.

Character Entity Name Entity Number


< &lt; &#60;
> &gt; &#62;
& &amp; &#38;
(non-breaking space) Eg. &nbsp; Eg.
&#160;
10 PM <p>10&nbsp&nbspPM</p>

6) What are different types of lists in HTML?

HTML lists come in three types:

Ordered Lists (<ol>): For numbered lists.

Unordered Lists (<ul>): For bullet point lists.

Description Lists (<dl>): For terms and their descriptions.

7) What is the ‘class’ attribute in HTML?

The class attribute in HTML assigns one or more class names to an element, typically for styling
with CSS or scripting with JavaScript.

8) What is the difference between the ‘id’ attribute and the ‘class’ attribute of HTML
elements?

The main differences between the id attribute and the class attribute in HTML are:

id must be unique, identifying a single element, while class can be applied to multiple elements.

id is often used for specific targeting in scripting or styling, while class is used for styling or
scripting across multiple elements.

9) Define multipart form data?

Multipart form data is a way to send form-based data, like files or non-ASCII text, in HTTP
requests. It's used for uploading files through forms on websites.
Here's a simple example in HTML:

html

Copy code

<form action="/upload" method="post" enctype="multipart/form-data">

<input type="file" name="file">

<input type="submit" value="Upload">

</form>

The enctype="multipart/form-data" attribute specifies that the form will be submitted as


multipart form data.

The <input type="file"> element allows users to select a file to upload.

When the form is submitted, the file data will be encoded as multipart form data in the HTTP
request.

10) Describe HTML layout structure.

Every web page has different components to display the intended content and a specific UI. But
still, there are few things which are templated and are globally accepted way to structure the web
page, such as:

 <header>: Stores the starting information about the web page.


 <footer>: Represents the last section of the page.
 <nav>: The navigation menu of the HTML page.
 <article>: It is a set of information.
 <section>: It is used inside the article block to define the basic structure of a page.
 <aside>: Sidebar content of the page.

11) What are the latest versions of HTML?

The latest version of HTML is HTML5. HTML5 is the fifth major revision of the HTML
standard.
12) What is the syntax of HTML?

The syntax of HTML (HyperText Markup Language) is based on the use of tags to structure and
display content on web pages. Followed by basic structure i.e head,body tags, etc.

13) What is a tag in HTML?

A tag in HTML is a code element that defines the structure and content of a web page. Tags are
the fundamental building blocks of HTML, and they usually come in pairs: an opening tag and a
closing tag, although some tags are self-closing.
Ex: <p>,</p>,<img>,</br>
14)what is an Element in HTML?
An element in HTML represents a piece of content or structure within a web page. It is defined
by a pair of tags: an opening tag and a closing tag, along with any content between them. Some
elements are self-closing and do not have closing tags.
Ex: <p>hello world</p>,<img src=””>
15) What is an attribute in HTML?
An attribute in HTML provides additional information about an HTML element. Attributes are
always included within the opening tag of an element and typically come in name-value pairs.
Ex: <p class=”paragraph”>hello world come to learn HTML</p>
16) What is the difference between HTML and XHTML?
HTML: Flexible, lenient syntax, more widely used, case-insensitive, optional closing tags.
XHTML: Stricter, XML-based, case-sensitive, mandatory closing tags and quotes, requires well-
formed documents.
HTML is more common and user-friendly for general web development, while XHTML is used
in scenarios requiring strict compliance with XML standards.
17) What are the types of lists available in HTML?
Ordered List (<ol>): Numbered list items. <ol> <li></li></ol>
Unordered List (<ul>): Bulleted list items.<ul><li></li></ul>
Description List (<dl>): List of terms and descriptions.<dl><dt></dt><dd></dd></dl>
18) What is the use of the <head> tag in HTML?
The <head> tag in HTML is used to provide meta-information about the document, such as its
title, character encoding, and links to external resources like stylesheets and scripts. It contains
elements that are not directly displayed on the web page but are important for search engines,
browsers, and other software that processes the page.
19)Why need to provide meta information and what is that ?
Providing meta-information in HTML is essential for several reasons:
Document Presentation: Meta-information, such as the document's title, character encoding, and
viewport settings, helps browsers present the content correctly to users.
Search Engine Optimization (SEO): Meta-tags like <title>, <meta description>, and <meta
keywords> provide information to search engines about the content of the page, helping improve
its visibility in search results.
Social Sharing: Meta-tags, such as Open Graph and Twitter Card tags, control how content is
displayed when shared on social media platforms, ensuring a better user experience.
Common Meta-Tags
<title>: Defines the title of the document, displayed in the browser's title bar or tab.
<meta charset>: Specifies the character encoding of the document.<meta charset="UTF-
8">Unicode Transformation Format, 8-bit.
<meta name="viewport">: Sets the viewport properties, controlling how the webpage is
displayed on different devices.
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description">: Provides a brief description of the document, often used by search
engines.
<meta name="description" content="This is a description of my webpage.">
<meta name="keywords">: Specifies keywords related to the document's content, used by search
engines for indexing.
<meta name="keywords" content="HTML, CSS, JavaScript">
<meta name="author">: Indicates the author of the document.
<meta name="author" content="John Doe">
20) What is the use of the <header> tag in HTML?
The <header> tag is used to define the header section of a document or a section within a
document.
It typically contains introductory content, such as headings, logos, navigation menus, and other
elements that are repeated across multiple pages or sections within a page.
Using the <header> tag helps provide semantic structure to the document and enhances
accessibility and search engine optimization.
21) What is the use of the <footer> tag in HTML?
The <footer> tag is used to define the footer section of a document or a section within a
document.
It typically contains content that appears at the bottom of a page or section, such as copyright
information, contact details, navigation links, or other relevant information.
22) What is the use of the <nav> tag in HTML?
The <nav> tag in HTML is used to define a section of navigation links within a document. It is
typically used to wrap around a set of links that provide navigation to different pages or sections
within a website.
23) What is the use of the <article> , <section> , <aside> tags in HTML?
<article>: Represents a standalone piece of content, such as a blog post or news article.
<section>: Groups related content thematically, helping to organize the document.
<aside>: Contains content that is tangentially related to the main content, such as sidebars or
related links.
24)what is the semantic and non-semantic tags?
In HTML, semantic elements are those that clearly describe their meaning in a human- and
machine-readable way. These elements define the structure and content of a document and
improve accessibility, SEO, and code readability.
Ex: <header>,<nav>,<footer>
Non-semantic elements, on the other hand, do not provide any information about the content they
contain; they are simply used to structure the layout of the page.
Ex: <b>,<i>,<div>,<span>
25) What is the use of the <a> tag in HTML?
The <a> tag in HTML is used to create hyperlinks, allowing users to navigate from one web page
to another or to different sections within the same page. It stands for "anchor" and is one of the
most fundamental elements for creating interconnected web pages.
26)What is the use of the <form> tag in HTML?
The <form> tag in HTML is used to create an interactive form on a web page. Forms allow users
to input data and submit it to a server for processing. They are essential for various online
activities such as user registration, login, surveys, and e-commerce transactions.

Key Points:
Input Fields: The <form> tag contains input fields, such as text fields, checkboxes, radio
buttons, dropdown lists, and buttons, where users can enter or select data.
Action Attribute: The action attribute specifies the URL of the server-side script or program that
will handle the form submission. When the form is submitted, the data entered by the user is sent
to this URL for processing.
Method Attribute: The method attribute specifies the HTTP method used to submit the form
data to the server. The two most common methods are GET and POST.
 GET: Appends the form data to the URL as a query string. Suitable for simple data
retrieval and search forms.
 POST: Sends the form data in the request body. Suitable for forms that may contain
sensitive or large amounts of data.
Submit Button: The <input type="submit"> or <button type="submit"> element is used to
create a button that users can click to submit the form data.
Other Attributes: The <form> tag can also have other attributes like name, target, and enctype,
which control various aspects of form submission and behavior.

27) What is the use of the <textarea> tag in HTML?


The <textarea> tag in HTML is used to create a multi-line text input field within a form. Unlike
the <input> tag with type "text", which provides a single-line text box, the <textarea> tag allows
users to enter larger amounts of text, making it suitable for comments, feedback, messages, and
other types of long-form text input.
The tag supports various attributes to control its behavior and appearance, such as rows, cols,
name, placeholder, and more
28) What is the use of the <select> tag in HTML?
The <select> tag in HTML is used to create a drop-down list, allowing users to choose one or
more options from a predefined set. This tag is commonly used in forms where a limited set of
choices is required, such as selecting a country, state, or category.

<form action="/submit_form.php" method="post">


<label for="country">Choose a country:</label>
<select id="country" name="country">
<option value="usa">United States</option>
<option value="canada">Canada</option>
<option value="uk">United Kingdom</option>
<option value="australia">Australia</option>
</select>
<input type="submit" value="Submit">
</form>

29) What is the use of the <fieldset> tag in HTML?


The <fieldset> tag is a valuable tool for organizing form elements in a way that is both visually
and semantically meaningful, improving the overall user experience and accessibility of web
forms.
Legend use
The <legend> tag in HTML is used to provide a caption or title for the content grouped within a
<fieldset>. It helps to describe the purpose or context of the fieldset, making it clear to users
what the grouped form elements are about. The <legend> tag enhances both the visual
presentation and the semantic structure of a form.
<form>
<fieldset>
<legend>Personal Information</legend>
<label for="fname">First Name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last Name:</label>
<input type="text" id="lname" name="lname"><br><br>
<label for="email">Email:</label>
<input type="email" id="email" name="email"><br><br>
</fieldset>
<fieldset>
<legend>Account Details</legend>
<label for="username">Username:</label>
<input type="text" id="username" name="username"><br><br>
<label for="password">Password:</label>
<input type="password" id="password" name="password"><br><br>
</fieldset>
<input type="submit" value="Submit">
</form>

30) What is the difference between the <strong> and <em> tags in HTML?
The <strong> tag is used to indicate that the enclosed text is of strong importance or urgency. It
signifies that the text is more important than the surrounding text.
The <strong> tag is used to indicate that the enclosed text is of strong importance or urgency. It
signifies that the text is more important than the surrounding text.
31) What is the difference between the <strong> and <b> tags in HTML?
 Use <strong> when you want to emphasize the importance of the text semantically. This
is suitable for highlighting key points, warnings, or important information that should
stand out in terms of meaning.
 Use <b> when you need to apply bold styling for visual purposes without adding any
semantic importance. This might be useful for keywords, headings, or other text where
the bold style enhances readability or design but does not imply additional significance.
32) What is the use of the <!DOCTYPE> declaration in HTML?
The <!DOCTYPE> declaration is an instruction to the web browser about what version of
HTML the page is written in. It helps the browser display the content correctly.
 Purpose: The <!DOCTYPE> declaration defines the HTML version and triggers
standards mode in browsers.
 Usage in HTML5: Use <!DOCTYPE html> at the beginning of your HTML document.
 Importance: It ensures your web pages are rendered consistently and correctly according
to web standards.
33) What is an SVG in HTML?
SVG is commonly used for creating icons, illustrations, and other graphics on the web because
of its scalability and flexibility.

34) What is the use of the <canvas> tag in HTML?


The <canvas> tag in HTML is used to draw graphics, animations, and other visual elements on a
web page dynamically using JavaScript. It provides a drawing surface where you can manipulate
pixels to create various types of graphics, such as charts, graphs, animations, games, and more

35) What is the use of the <embed> tag in HTML?


The <embed> tag in HTML is used to embed external content, such as multimedia files like
audio, video, maps,or interactive content, into a web page. It allows you to include content from
other sources directly within your HTML document.

36) What is the use of the <object> tag in HTML?


The <object> tag in HTML is used to embed various types of external resources or plugins into a
web page, such as images, audio files, video files, PDF documents, and more. It provides a way
to include content that may not be directly supported by the browser or to specify fallback
content in case the browser doesn't support the embedded resource.
37) What is the difference between <div> and <span> tags in HTML?
Use <div> for larger structural divisions of content and to create block-level elements.
Use <span> for smaller, inline styling or grouping of content within a larger block of text or
inline content.
38) What is the difference between the <input type="submit"> and <input type="button">
tags in HTML?
Use <input type="submit"> when you want a button that submits a form.
Use <input type="button"> when you want a generic button that triggers JavaScript actions or
functions, but doesn't submit a form by default
39) What is the difference between the <img> and <picture> tags in HTML?
<img> Tag:
Basic way to put an image on a webpage.
Just specify the image source (src) and maybe a description (alt).
Use when you have one image that works for all screen sizes.

<img src="image.jpg" alt="Description of image">

<picture> tag:
More advanced.
Lets you provide different images for different screen sizes or resolutions.
Useful for making your site look good on all devices.

<picture>
<source srcset="small.jpg" media="(max-width: 600px)">
<source srcset="medium.jpg" media="(max-width: 1200px)">
</picture>

40)What is the use of the colspan and rowspan attributes in the <td> tag in HTML?
colspan:
Helps a cell stretch across more than one column horizontally.
Just say how many columns you want it to cover, and it does the trick.
rowspan:
Makes a cell cover more than one row vertically.
You tell it how many rows, and it expands accordingly.
These attributes are handy for making your tables look just right!
41)What is the use of the <datalist> tag in HTML?
The <datalist> tag in HTML is used to provide a predefined list of options for an <input>
element with the list attribute.

<input list="browsers">
<datalist id="browsers">
<option value="Chrome">
<option value="Firefox">
<option value="Safari">
<option value="Edge">
<option value="Opera">
</datalist>

42) How to create a nested webpage in HTML?


We can use the iframe tag to represent a webpage within a webpage. It defines an inline frame on
the HTML page.
43)What is a marquee tag?
Marquee tag is used to put the scrolling text on a web page. We can scroll the image or text to up,
down, left or right automatically. We should put the text within the tag, which you want to scroll.

44) How do you separate a section of texts in HTML?


We separate a section of texts in HTML using the below tags:
 <br> tag – It is used to separate the line of text. It breaks the current line and shifts the
flow of the text to a new line.
 <p> tag–This tag is used to write a paragraph of text.

 <blockquote> tag–This tag is used to define large quoted sections.

45) What is the role of the action attribute in HTML forms?

The action attribute is used to specify the URL of the script or program that will process the data
submitted by the form. When the user clicks the submit button, the form data is sent to the
specified URL for processing.
46) What is the role of the method attribute in HTML forms?

The method attribute is used to specify the HTTP method that will be used to submit the form
data. The two most common methods are GET and POST. GET is used to retrieve data from the
server, while POST is used to send data to the server.

47) In how many ways can you display HTML elements?

HTML elements can be displayed in several ways, including block, inline, inline-block, and
none. The display property can specify how an element should be displayed.

48)What is the difference between link tag <link> and anchor tag <a>?

The <link> tag links external resources, such as CSS stylesheets, to an HTML document. The
<a> tag creates links to other pages or resources within the same document.

49) What are the different types of form input fields in HTML?

Several form input fields in HTML include text fields, checkboxes, radio buttons, select menus,
and text areas. Each input field type is used to collect different types of data from users.

50) What is the difference between HTML and HTML5?


HTML5 is the latest version of HTML and includes new features and improvements over
previous versions. Some key differences between HTML and HTML5 include support for
multimedia elements (such as video and audio), improved semantics, and better support for
mobile devices.

You might also like