0% found this document useful (0 votes)
36 views39 pages

HTML Intreview Questions and Answers

The document provides a comprehensive guide on HTML, covering topics such as inserting images, setting background images, commenting, linking CSS, creating forms, and more. It explains various HTML tags and attributes, including <img>, <table>, <button>, and <a>, along with their usage and examples. Additionally, it discusses the differences between HTML and HTML5, as well as best practices for formatting and structuring web pages.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
36 views39 pages

HTML Intreview Questions and Answers

The document provides a comprehensive guide on HTML, covering topics such as inserting images, setting background images, commenting, linking CSS, creating forms, and more. It explains various HTML tags and attributes, including <img>, <table>, <button>, and <a>, along with their usage and examples. Additionally, it discusses the differences between HTML and HTML5, as well as best practices for formatting and structuring web pages.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 39

1. What is HTML?

The full form of HTML stands for Hypertext Markup Language and it also
allows the user to create and structure sections, paragraphs, headings,
links, and blockquotes for web pages and applications.

2. How to insert an image in HTML?

<img> tag is used to add an image in a web page.

Images are not inserted into a web page basically they are linked to web
pages. The <img> tag helps to create a holding space for the referenced
image.

The <img> tag is normally empty, it has attributes only, and does not have
a closing tag.

<img> tag has two required parameters:

 src – The path to the image


 alt – An alternate text for the image
To insert a image in html you need to use img tag:

<img src="image path" alt="Italian Trulli">

<img src="demo.jpg" alt="Italian Trulli">

3. How to set background image in HTML?

In order to add a background image on an HTML element you need to use


two things:

1. the HTML style attribute and


2. the CSS background-image property:
3.
<div style="background-image: url('img_boy.jpg');">

4. How to comment in HTML?


Normally HTML comments are not being displayed in the browser. But
these comments can help to document the HTML source code.

<!– Write your comments here –>

5. How to give space in HTML?

In order to add a space in the webpage, Go where you want


to add the space and then use the spacebar. Normally, HTML displays
one space between words, no matter how many times you have entered
the space bar.

Now if you Type &nbsp; to force an extra space.

This is known as a non-breaking space because it helps to prevent a line


break at its location.

6. How to link CSS to HTML?

Before start with how to link CSS with HTML,

Let’s have a look at: What is CSS?

Full form of CSS stands for Cascading Style Sheets (CSS) which is used to
format the layout of a webpage.

With the help of CSS, someone can control the color, font, the size of text,
the spacing between elements and also how elements are positioned and
laid out, what background images or background colors to be used,
different displays for different devices and screen sizes, and so many more
as well.

Types of CSS:

So there are three ways to add CSS to HTML documents :

 Inline – by putting the style attribute inside HTML elements


 Internal – by putting a <style> element in the <head> section
 External – by adding a <link> element to link to an external
CSS file
The most common and used way to add CSS, is to have the styles in
external CSS files.

Inline CSS

An inline CSS can be used to apply a unique and also different style to a
single HTML element.

An inline CSS has the style attribute of an HTML element.

Now put the text color of the <h1> element to red, and the text color of the
<p> element to blue:

<h1 style="color:red;">A Blue Heading</h1>

<p style="color:blue;">A red paragraph.</p>

Internal CSS

An internal CSS can be used to define a style for a single HTML page.

An internal CSS is used to define in the <head> section of an HTML page


and also within a <style> element.

Now let’s have an example of the text color of ALL the <h1> elements (on
that page) to blue, and the text color of ALL the <p> elements to red.

The page will be displayed with “powderblue” background color:

<!DOCTYPE html>

<html>

<head>

<style>

body {background-color: powderblue;}

h1 {color: blue;}
p {color: red;}

</style>

</head>

<body>

External CSS

An external style sheet concept is normally used to define the style for
many HTML pages.

In order to start using an external style sheet, put a link to it in the <head>
section of each HTML page:

<!DOCTYPE html>

<html>

<head>

<link rel="stylesheet" href="styles.css">

</head>

<body>

<h1>This is a heading</h1>

<p>This is a paragraph.</p>

</body>

</html>
<h1>This is a heading</h1>

<p>This is a paragraph.</p>

</body>

</html>

7. How to align text in HTML?

Basically, if you want to align your text using HTML, then you need to use
css and follow the proper process:

div.a {

text-align: center;

div.b {

text-align: left;

div.c {

text-align: right;

div.c {

text-align: justify;
}

The text-align property discusses the horizontal alignment of text in an


element.

8. How to create a table in HTML?

HTML tables help web developers to set the data into rows and columns.

The <table> tag is there in the HTML table.


Each table row can be defined with a <tr> tag.
Each header can be defined with a <th> tag.
Each data or the cell is defined with a <td> tag.
If your text is in the <th> elements then they will be bold and centered.
If your text is in the <td> elements then they will be regular and left-aligned.

<table style="width:100%">

<tr>

<th>Firstname</th>

<th>Lastname</th>

<th>Hobbies</th>

</tr>

<tr>

<td>Ram</td>

<td>Kumar</td>

<td>Travelling</td>

</tr>

<tr>

<td>Shyam</td>
<td>Chadra</td>

<td>Reading books</td>

</tr>

</table>

9. How to convert HTML to PDF?

If you are working in a Windows system then open an HTML web page in
Internet Explorer, Google Chrome or Firefox.

 On a Mac, open an HTML web page in Firefox


 Press on the “Convert to PDF” button in the Adobe PDF toolbar
in order to get started with the PDF conversion
Enter the filename and save your new PDF file in a desired

location
10. How to change text color in HTML?

The HTML style attribute is the option to add styles to an element, like:
Color, Font, Size, and more.

<!DOCTYPE html>

<html>

<body>

<p>I am normal</p>

<p style="color:red;">This is red</p>

<p style="color:blue;">This is blue</p>

<p style="font-size:50px;">I am Fat and big</p>

</body>
</html>

11. How to change font color in HTML?

<font> tag, is used to specify the text color.

1. <font Color=”Blue”>
2. <font color=”rgb(128,128,0)”
3. <font color=”#00FF00″>
<!DOCTYPE html>

<html>

<head>

<title>

Example of color attribute

</title>

</head>

<body>

<font color="orange">

<!-- The color attribute of font tag sets the color name 'orange' for the word
Great Learningt-->

<center>

<h1>

Great Learning

</h1>

</center>

</font>
</body>

</html>

12. How to change background color in HTML?

<!DOCTYPE html>

<html>

<body style="background-color:powderblue;">

<h1>This is a sample 1</h1>

<p>This is a sample 2.</p>

</body>

</html>

13. What is doctype in HTML?

The HTML Document Type.

It is a way to give “information” to the browser about what will be the


document type to expect. In HTML5, the <! DOCTYPE> declaration is
simple: <! DOCTYPE html>

14. How to change font style in HTML?

<!DOCTYPE html>

<html>

<head>

<title>HTML Font</title>

</head>
<body>

<h1>Our Products</h1>

<p style = "font-family:georgia,garamond,serif;font-size:16px;font-


style:italic;">

This is sample doc

</p>

</body>

</html>

15. How to add space using < pre > tag in HTML?

The pre tag is used to create preformatted text. The text inside this tag will
preserve both spaces and line breaks. To add space using the tag, you can
add the style attribute and set the value to “margin:10px”.

16. What is dom in HTML?

DOM stands for Document Object Model. When a web page is getting
loaded that time the browser creates a Document Object Model of the page
and it is constructed as a tree of Objects. HTML DOM is basically an Object
Model for HTML.

HTML DOM describes:

 The HTML elements as objects


 Properties of all HTML elements
 Methods of all HTML elements
Events of all HTML elements
17. How to add image in HTML from a folder?

1. Copy the image from your images folder.


2. Open up the index.
3. Code: <img src=”” alt=”My test image“> is the HTML code that
inserts an image into the page.
4. Insert the file path into your HTML code between the double
quote marks of the src=”” code.
18. How to create form in HTML?

<form>

<label for="fname">First name:</label><br>

<input type="text" id="fname" name="fname"><br>

<label for="lname">Last name:</label><br>

<input type="text" id="lname" name="lname">

</form>

19. How to create button in HTML?

<button type="button">Click Here!</button>

20. How to run HTML program?

1. Step 1: Open Notepad (PC) Windows 8 or later: …


2. Step 1: Open TextEdit (Mac) Open Finder > Applications >
TextEdit.
3. Step 2: Write Some HTML. Write or copy the
following HTML code into Notepad:
4. Step 3: Save the HTML Page. Save the file on your computer.

5. Step 4: View the HTML Page in Your Browser
21. How to save HTML file?

In order to save html file

 On the main menu


 click File > Save As
 Right-click within the HTML document
 click File > Save As
In the Save As dialog box, specify the file name and location,
then click Save
22. How to select multiple options from a drop down list in HTML?

<label for="Fruit">Choose a Fruit:</label>

<select name="Fruit" id="Fruit">

<option value="Mango">Mango</option>

<option value="Lichhi">Licchi</option>

</select>

23. How to use div tag in html to divide the page?

The div tag stands for Division tag. This is used in HTML to make divisions
of content in the web page like text, images, header, footer, navigation bar,
etc. Div tag has two parts like:

1. open(<div>) and
2. closing (</div>) tag and it is mandatory to maintain the tag.
The Div is the most used tag in web page development because it has
power to separate respective data in the web page and also a particular
section can be created for particular data or function in the web pages.

 Div tag is Block level tag


 Generic container tag
<html>

<head>

<title>div tag demo</title>

<style type=text/css>

p{
background-color:gray;

margin: 100px;

div

color: white;

background-color: 009900;

margin: 4px;

font-size: 35px;

</style>

</head>

<body>

<div > div tag demo 1 </div>

<div > div tag demo 2 </div>

<div > div tag demo 3 </div>

<div > div tag demo 4 </div>


</body>

</html>

24. What is HTML used for?

HTML is used to make static web pages and HTML stands for markup
language.

25. How to align text in center in HTML?

<!DOCTYPE html>

<html>

<head>

<title>New HTML Document</title>

</head>

<body>

<h1>Demo</h1>

<p style="text-align:center;">Great Learning</p>

</body>

</html>

26. How to increase font size in HTML?

<!DOCTYPE html>

<html>

<head>

<title>Demo HTML font size</title>


</head>

<body>

<h1 style="color:red;font-size:40px;">Heading</h1>

<p style="color:blue;font-size:18px;">Font size demo</p>

</body>

</html>

27. What tag is used to create button in HTML?

The HTML <button> tag is used to create a button in a website.

28. How to add images in html?

<img src="img.jpg" alt="Italian Trulli">

29. How to change button color in HTML?

<!DOCTYPE html>

<html>

<head>

<style>

.button {

background-color: #4CAF50; /* Green */

border: none;

color: white;

padding: 15px 32px;

text-align: center;

text-decoration: none;
display: inline-block;

font-size: 16px;

margin: 4px 2px;

cursor: pointer;

.buttondemo {background-color: #008CBA;} /* Blue */

.buttondemo2 {background-color: #f44336;} /* Red */

.buttondemo3 {background-color: #e7e7e7; color: black;} /* Gray */

.buttondemo4 {background-color: #555555;} /* Black */

</style>

</head>

<body>

<h2>Button Colors</h2>

<p>Change the background color of a button with the background-color


property:</p>

<button class="button">Green</button>

<button class="button buttondemo">Blue</button>

<button class="button buttondemo2">Red</button>

<button class="button buttondemo3">Gray</button>


<button class="buttonbuttondemo4">Black</button>

</body>

</html>

30. Which is better: HTML or HTML5?

HTML5 is the newest version of HTML and it is better than HTML because
it includes new features like audio and video elements, new semantic
elements, and support for local storage.

31. How to create drop down list in HTML?

1<label for="Fruits">Choose a Fruit:</label>


2
3<select name="Fruits" id="cars">
4 <option value="Mango">Mango</option>
5 <option value="Apple">Apple</option>
6
7</select>
32. What is span in HTML?

The HTML <span> element stands for a generic inline container for
phrasing content, that does not inherently represent anything. It can also be
used to group elements for styling purposes like using the class or id
attributes, or because they share attribute values, such as lang.

33. How to underline text in HTML?

<u> tag is used for underline the text. The <u> tag was deprecated
in HTML, but then they re-introduced in HTML5.

34. What is a “fieldset” tag in HTML?

A fieldset is used to group related elements in a form. It is useful for


creating structures such as tables or grid layouts.

35. How to put an image in HTML?


<img> tag is used to insert an image in a web page.

36. How to change font in HTML?

<font> tag,is used to specify the text color.

 <font Color=”Blue”>
 <font color=”rgb(128,128,0)”
 <font color=”#00FF00″>
1
2
3
4
5
6
7
8
9
1<!DOCTYPE html>
0<html>
1<head>
1<title>
1 Example of color attribute
2</title>
1</head>
3<body>
1<font color="orange">
4<!-- The color attribute of font tag sets the color name 'orange' for t
1<center>
5<h1>
1Great Learning
6</h1>
1</center>
7</font>
1</body>
8</html>
37. How to add a link in HTML?

To add links in html we use <a> and </a> tags, which are the tags used to
define the links. The <a> tag indicates where the hyperlink starts and the
</a> tag indicates where it ends. Whatever text gets added inside these
tags, will work as a hyperlink. Add the URL for the link in the <a href=” ”>.

38. What is HTML tags?

1<!DOCTYPE html>
2
3
4
5<html lang="en">
6<head>
7 <title>Title of the document</title>
8</head>
9<body>
1
0<h1>This is a heading</h1>
1<p>This is a paragraph.</p>
1
1</body>
2</html>
39. How to create a checkbox in HTML?

1<input type="checkbox" id="car" name="vehicle1" value="Bike">


2<label for="car1"> I have a Alto</label><br>
3<input type="checkbox" id="car2" name="vehicle2" value="Car">
4<label for="car2"> I have an Audi</label><br>
5<input type="checkbox" id="car3" name="vehicle3" value="Boat">
6<label for="car3"> I have a BMW</label><br>
40. How to create a box in HTML?

1<!DOCTYPE html>
2<html>
3<head>
4<style>
5div {
6 background-color: lightgrey;
7 width: 300px;
8 border: 15px solid green;
9 padding: 50px;
1 margin: 20px;
0}
1</style>
1</head>
1<body>
2
1<h2>Demonstrating the Box Model</h2>
3
1<p>Hey, welcome to Great Learning.</p>
4
1<div>Great Learning Academy is an initiative taken by Great Learning, w
5Science, Machine Learning, Artificial Intelligence, Cloud Computing, Bu
1
6</body>
1</html>
7
1
8
1
9
2
0
2
1
2
2
2
3
41. How to add a scroll bar in HTML?

1<!DOCTYPE html>
2<html>
3<head>
4<style>
5div.ex1 {
6 background-color: lightblue;
7 width: 110px;
8 height: 110px;
9 overflow: scroll;
1}
0
1div.ex2 {
1 background-color: lightblue;
1 width: 110px;
2 height: 110px;
1 overflow: hidden;
3}
1
4div.ex3 {
1 background-color: lightblue;
5 width: 110px;
1 height: 110px;
6 overflow: auto;
1}
7
1div.ex4 {
8 background-color: lightblue;
1 width: 110px;
9 height: 110px;
2 overflow: visible;
0}
2</style>
1</head>
2<body>
2
2
3
2
4
2
5
2
6
2
7
2
8
2
9
3
0
3
1
3
2
3
3
3
4
3
5
3
6
3
7
3
8
3
9
4
0<h1>Welcome to great learning</h1>
4
1
4
2<h2>scroll:</h2>
4<div class="ex1">Great Learning Academy is an initiative taken by Great
3in Data Science, Machine Learning, Artificial Intelligence, Cloud Compu
4</body>
4</html>
42. What is an attribute in HTML?

HTML attributes help to provide the additional information about HTML


elements.
 All HTML elements always have attributes
 Attributes provide additional information about elements
 Attributes always have the start tag
 Attributes usually use in name/value pairs like: name=”value”
43. How to increase button size in HTML?

1<button type="button">Click Here!</button>


44. How to change font size in HTML?

1
2<!DOCTYPE html>
3 <html>
4 <head>
5 <title>Demo HTML font size</title>
6 </head>
7 <body>
8 <h1 style="color:red;font-size:40px;">Heading</h1>
9 <p style="color:blue;font-size:18px;">Font size demo</p>
1 </body>
0</html>
45. How to change color of text in HTML?

1<p style="color:red">This is a demo</p>


2<p style="color:blue">This is another demo</p>
3This concept is not used in HTML5
46. How to bold text in HTML?

To text bold in HTML, use the <b> </b> tag or <strong> </strong> tag.

1<b> hey, welcome to great learning!</b>


47. How to add a footer in HTML?

1<!DOCTYPE html>
2<html>
3<body>
4
5<h1>The footer element</h1>
6
7<footer>
8 <p>demo of footer<br>
9 <a href="mailto:[email protected]">[email protected]</a></p>
1</footer>
0
1</body>
1</html>
1
2
1
3
1
4
48. Who invented HTML?

The inventor of HTML Tim Berners-Lee.

49. How to align the image in the center in HTML?

1<img src="demo.jpg" alt="Paris" class="center">


50. How to create a hyperlink in HTML?

a hyperlink in an HTML page, use the <a> and </a> tags

51. How do add a header in HTML?

1
2
3
4<!DOCTYPE html>
5<html>
6<body>
7
8
9 <header>
1 <b>hey</b>
0 </header>
1
1
1</body>
2</html>
52. How to give space between two buttons in HTML?

1<div class='myDiv'>
2 <button style='margin-right:16px'>Button 1</button>
3 <button style='margin-right:16px'>Button 2</button>
4 <button>Button 3</button>
5</div>
53. How to change image size in HTML?

1<img src="demo.jpg" alt="Nature" style="width:500px;height:600px;">


The width and height attributes always define the width and height of the
image in pixels.

54. Why do we use doctype in HTML?


Doctype is used for Document Type Declaration and also It informs the
web browser about the type and version of HTML used in building the web
document.

55. What tag is used to add a video in HTML?

The HTML <video> element is used to show a video on a web page.

56. How to add favicon in HTML?

You can create a .png image and then use f the following snippets between
the <head> tags for the static HTML documents:

1<link rel="icon" type="image/png" href="/favicon.png"/>


2<link rel="icon" type="image/png" href="https://example.com/favicon.png"
57. How to embed YouTube video in HTML?

1. On a computer, go to the YouTube video you want to embed.


2. Under the video, click SHARE .
3. Click Embed.
4. From the box that appears, copy the HTML code.
5. Paste the code into your blog or website HTML.
58. How to write text on image in HTML?

1<div class="container">
2 <img src="img_snow.jpg" alt="Snow" style="width:100%;">
3 <div class="bottom-left">Left</div>
4 <div class="top-left">Up Left</div>
5 <div class="top-right">Up Right</div>
6 <div class="bottom-right"> Right</div>
7 <div class="centered">Middle</div>
8</div>
59. How to create a popup in html with CSS?

1<div class="popup" onclick="myFunction()">Click me!


2 <span class="popuptext" id="NewPopup">Your text</span>
3</div>
60. How to connect html to database with MySQL?

 Step 1: Filter your HTML form requirements for your contact us


web page.
 Step 2: Create a database and a table in MySQL.
 Step 3: Create HTML form.
 Step 4: Create PHP page to Insert contact us HTML form data
in MySQL database.
 Step 5: All done!
61. How to blink text in HTML?

The HTML <blink> tag stands for a non-standard element that is used to
create an enclosed text. It flashes slowly and normally blinks, meaning is
light flashing on and off in a regular or intermittent way so samely blinking
effect is used very rarely, as it is not eye soothing for users to watch a part
of text constantly turning on and off.

62. How to add calendar in HTML Form?

1
2
3
4
5
6
7
8
9
1
0
1<!DOCTYPE html>
1<html>
1<body>
2
1
3
1<button onclick=”CalenderFunction()">Put the date</button>
4
1
5<script>
1function CalenderFunction()n() {
6 var x = document.createElement("INPUT");
1 x.setAttribute("type", "date");
7 x.setAttribute("value", "2014-02-09");
1 document.body.appendChild(x);
8}
1</script>
9
2</body>
0</html>
63. How to add video in HTML?
1The HTML <video> element is used to show a video on a web page.
2<video width="320" height="240" controls>
3 <source src="movie.mp4" type="video/mp4">
4 <source src="movie.ogg" type="video/ogg">
5Your browser does not support the video tag.
6</video>
64. How to add google map in HTML?

1
2
3
4
5
6
7
8
9
1
0
1
1
1<!DOCTYPE html>
2<html>
1<body>
3
1<h1> Google Map</h1>
4
1<div id="googleMap" style="width:100%;height:400px;"></div>
5
1<script>
6function myMap() {
1var mapProp= {
7 center:new google.maps.LatLng(51.508742,-0.120850),
1 zoom:5,
8};
1var map = new google.maps.Map(document.getElementById("googleMap"),mapP
9}
2</script>
0
2<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY&callb
1
2</body>
2</html>
65. How to create registration form in HTML with database?

1<form>
2 <label for="fname">First name:</label><br>
3 <input type="text" id="fname" name="fname"><br>
4 <label for="lname">Last name:</label><br>
5 <input type="text" id="lname" name="lname">
6</form>
66. How to create a dynamic calendar in HTML?

1<div class="month">
2 <ul>
3 <li class="prev">❮</li>
4 <li class="next">❯</li>
5 <li>August<br><span style="font-size:18px">2017</span></li>
6 </ul>
7</div>
8
9<ul class="weekdays">
1 <li>Mo</li>
0 <li>Tu</li>
1 <li>We</li>
1 <li>Th</li>
1 <li>Fr</li>
2 <li>Sa</li>
1 <li>Su</li>
3</ul>
1
4<ul class="days">
1 <li>1</li>
5 <li>2</li>
1 <li>3</li>
6 <li>4</li>
1 <li>5</li>
7 <li>6</li>
1 <li>7</li>
8 <li>8</li>
1 <li>9</li>
9 <li><span class="active">10</span></li>
2 <li>11</li>
0 </ul>
2
1
2
2
2
3
2
4
2
5
2
6
2
7
2
8
2
9
3
0
3
1
67. How to create frames in HTML?

1
2
3
4
5
6
7
8
9
1
0<!DOCTYPE html>
1<html>
1
1 <head>
2 <title>HTML Demp Frames</title>
1 </head>
3
1 <frameset rows = "10%,80%,10%">
4 <frame name = "top1" src = "/html/top_frame.htm" />
1 <frame name = "mainframe" src = "/html/main_frame.htm" />
5 <frame name = "bottompart" src = "/html/bottom_frame.htm" />
1
6 <noframes>
1 <body>Hey Great Learning</body>
7 </noframes>
1
8 </frameset>
1
9</html>
68. How to create a menu in HTML?

1<!DOCTYPE html>
2<html>
3<head>
4<meta name="viewport" content="width=device-width, initial-scale=1">
5<style>
6div {
7 width: 35px;
8 height: 5px;
9
1
0
1
1
1
2
1
3
1
4
1
5
1
6 background-color: black;
1 margin: 6px 0;
7}
1</style>
8</head>
1<body>
9
2<p>Menu icon:</p>
0
2<div></div>
1<div></div>
2<div></div>
2
2</body>
3</html>
69. What is the difference between HTML tags and elements?

The starting and ending tags mark the beginning and end of the HTML
element. The tags are enclosed within the < and > symbol. HTML Elements
is the text written between HTML tags and it holds the content.

70. Which types of heading are found in HTML?

There are 6 types of headings that can be found in HTML which are
numbered <h1> to <h6> from largest to smallest. Headings are used in the
following way.

<h1> heading 1 </h1>

<h2> heading 2 </h2>

<h3> heading 3 </h3>


<h4> heading 4 </h4>

<h5> heading 5 </h5>

<h6> heading 6 </h6>

71. How can you insert a copyright symbol in HTML webpage?

To insert the copyright symbol you can use the “&#169” as well as “&copy”
in the HTML file.

72. How to specify the metadata in HTML?

<meta> is the tag used to specify metadata in HTML. <meta> is a void tag
which means there is no closing tag.

73. What are Inline and block elements in HTML?

The block elements take up the full page width and start on a new line,
instead of inline element that only take the space to accommodate the
length of the content and continue on the same line. Some examples of
block elements are <div>, <p>, <header>, <footer>, <h1>…<h6>, <form>,
<table>, <canvas>, <video>, <blockquote>, <pre>, <ul>, <ol>, <figcaption>,
<figure>, <hr>, <article>, <section>, etc. Some examples of inline
elements are <span>, <a>, <strong>, <img>, <button>, <em>, <select>,
<abbr>, <label>, <sub>, <cite>, <abbr>, <script>, <label>, <i>, <input>,
<output>, <q>, etc.

74. Is audio tag supported in HTML 5?

Audio tags are supported in HTML5 and with these, you can add audio to a
webpage. The file formats supported by HTML5 include MP3, WAV, and
OGG.

75. Is it possible to change the color of the bullet?

To change the color of the bullet, you need to change the text color of the
first line in the list. The bullet takes the color from the first line of the list.

76. How can you keep list elements straight in an HTML file?
You can use indents to keep the elements of a list aligned straight. You can
use a nested list and indent them further than the parent list, you can
quickly determine the lists and elements contained under the list.

77. What are Forms in HTML?

If you want to collect the information of the visitors to the webpage, you can
add a form to the webpage. Once the user enters the information into the
form fields, it is added to a database specified by you.

78. What are void elements in HTML?

Some elements in HTML only need an opening tag, without the need for a
close tag, and these are known as void elements. Some examples are
<br />, <img />, <hr />, etc.

79. What is a marquee?

A scrolling text that can go in a specific direction across the screen i.e. left,
right, up, or down, automatically. For this you can use the tag <marquee>
Text to scroll </marquee>.

80. What is an Anchor tag in HTML?

Whenever you need to link any two web pages, website templates, or
sections, you can do so using the anchor tag. The anchor tag format is <a
href=”#” target=”link”></a>. Here the ‘link’ is defined as the target attribute,
while the ‘href’ attribute indicates the sections in the documents.

81. What is an image map?

Identified by the <map> tag, the image map can link an image to different
web pages. It is one of the most asked questions in interviews these days.

82. What is datalist tag?

The datalist tag is an HTML tag that lets the user auto-complete the form
based on the predefined options. It presents the users with predefined
options that they can choose from. An example of this can be as below:

<label>

Enter your favorite Bollywood Actor: Press any character<br />


<input type=”text” id=”favBolActor” list=”BolActors”>

<datalist id=”BolActor”>

<option value=”Shahrukh Khan”>

<option value=”Akshay Kumar”>

<option value=”Aamir Khan”>

<option value=”Saif Ali Khan”>

<option value=”Ranbir Kapoor”>

<option value=”Ranveer Singh”>

<option value=”Sanjay Dutt”>

<option value=”Hrithik Roshan”>

<option value=”Varun Dhawan”>

<option value=”Ajay Devgan”>

</datalist>

</label>

83. What is difference between HTML and XHTML?

HTML and XHTML has a few differences as below:

 HTML stands for Hypertext Markup Language while XHTML


stands for Extensible Hypertext Markup Language
 The format of HTML is a document file format while for XHTML
the file format is a markup file format
 In HTML it is not necessary to close tags in the same order as
they were opened, but in XHTML it is necessary
 In XHTML, it is quite important to write doctype on the top of
the file; while in HTML is it not needed
 The file name extension used in HTML are .html, .htm.; and the
file name extension used in XHTML are .xhtml, .xht, .xml.
84. What is the ‘class’ attribute in HTML?

It is an attribute that refers to one or more than one class name for an
HTML element. The class attribute can be used for the HTML elements.

85. What is the use of an IFrame tag?

IFrame or Inline Frame is basically an HTML document implanted inside


the other HTML documents on a website. The IFrame element is used for
inserting content from other source, which can be an advertisement into a
webpage.

86. What is the use of figure tag in HTML 5?

The HTML figure tag is used for adding self-contained content such as
illustrations, photos, diagrams, or code listings. HTML figure tag contains
two tags such img src and figcaption. Img src is used for adding image
source in a document; while figcaption is used for setting caption to an
image.

87. Why is a URL encoded in HTML?

URL is encoded in HTML as it converts characters into a format that can be


transmitted over the web. A URL is transmitted over the internet through
the ASCII character set. The non-ASCII characters can be replaced by “%”
which is followed by hexadecimal digits.

88. What are the different kinds of Doctypes available?

A document type declaration or doctype is actually an instruction that


conveys to the web browser what type of document it should expect.

The <!DOCTYPE> declaration is included at the start of each document it


is added just above the <html> tag in each document.

The common doctype declaration for different version of HTML and XHTML
are:
1. For HTML 5 we simply write <!DOCTYPE html>
2. HTML 4.01 Strict: The strict version of HTML 4.01 does not
permit presentational to be written within HTML Elements. It
also does not support inclusion of Frames.
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN”
“http://www.w3.org/TR/html4/strict.dtd”>

3. HTML 4.01 Transitional: The transitional version of HTML 4.01


this Transitional document type definition (DTD) allows users to
utilize certain elements and attributes which were not allowed
to be used in strict doctype.
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”

“http://www.w3.org/TR/html4/transitional.dtd”>

4. HTML 4.01 Frameset: In HTML 4.01 version Frameset


document type definition (DTD),allows users to use frames.
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN”

“http://www.w3.org/TR/html4/frameset.dtd”>

5. XHTML 1.0 Strict: In XHTML 1.0 version Strict document type


definition (DTD), does not support deprecated tags and the
code must be written according to the XML Specification.
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

6. XHTML 1.0 Transitional: In XHTML 1.0 version Transitional


document type definition (DTD), allows deprecated elements.
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

7. XHTML 1.0 Frameset: In XHTML 1.0 version Frameset


document type definition (DTD), framesets are used.
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Frameset//EN”

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>
8. XHTML 1.1: In XHTML 1.1 version document type definition
(DTD), allows the addition of modules
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN”

“http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”>

89. Please explain how to indicate the character set being used by a
document in HTML?

HTML5 by default uses utf-8 charset even if it is not defined. To define


explicitly in an HTML document the character set is specified using the
charset attribute of a <meta> tag which is placed inside the <head>
element of the HTML.

1<head>
2 <title>Charset HTML</title>
3 <meta charset="UTF-8">
4</head>
90. What is the advantage of collapsing white space?

White spaces are a sequence of blank space characters, treated as a


single space character in an HTML document.

 The advantages of collapsing white space are


 Helps the content of the code to be more understandable and
readable to the users.
 Decreases the transmission time between the server and the
client and removes unnecessary bytes that are occupied by the
white spaces.
 If you leave extra white space by mistake, the browser will
ignore it and display the content properly.
91. What are HTML Entities?

Some characters are reserved in HTML that has special meaning.HTML


entities are used to display invisible characters and reserved characters
that might be interpreted as HTML code. HTML entities is a piece of text, or
string, that begins with an ampersand (&) and ends with a semicolon (;).

Few HTML Entities are:

 &nbsp; – non-breaking space


 &lt; – less than sign
 &gt; – greater than sign
 &amp; – ampersand (&)
 &quot; – double quotation mark
 &apos; – single quotation mark
 &cent; – cent sign
 &pound; – pound sign
92. Describe the HTML layout structure.

An HTML page layout describes the appearance of a website. An HTML


layout structure helps the user to navigate through web pages easily.
HTML layout specifies a way to arrange web pages in well-mannered, well-
structured using simple HTML tags.

HTML Layout can be structured

Using Tables. Giving rows and column and assigning text to it

Multiple Columns Layout using tables

Using DIV, SPAN tag

HTML Layout Elements: <header> to defines a header section for a


document

<nav> to define navigation links, <section> – to define a section in a


document, <article> – define an independent content, <aside> – defines a
sidebar content, <footer> – defines a footer for a section, <details> – to
define additional details ,<summary> – is to define a heading for the
<details> element.

93. How to optimize website assets loading?

Page loading refers to how quickly your content is displayed when a user
visits a page on your site.

The different ways to optimize assets loading are:

 Minimize HTTP requests


 Utilize Content Development Network (CDN) and remove
unused scripts/files
 Compress images and optimize files
 Caching data to the browser
 Reducing redirects to multiple pages
 Use asynchronous loading and delay loading for CSS and
JavaScript files
 Minify (removing unnecessary characters, spaces comments,
and any not required elements to reduce the size of the files)
CSS, JavaScript, and HTML
Remove unnecessary plugins
94. How is Cell Padding different from Cell Spacing?

Cell Padding and Cell Spacing are the attributes of formatting a table
basically sets the white spaces in your table.

Cell Padding Cell Spacing

Used to fix the width/space between the Fixes the white space between the single cell, i.e.,
border and its content space between the edges and adjacent cell

Syntax: Syntax:
<table cellpadding=”value” > <table cellspacing=”value” >
….. …..
….. ……
</table> </table>
Here, cellpadding value specifies the space Here, cellspacing value specifies the space
between the border and its content between adjacent cells

The default cellpadding value is 1 The default cell spacing value is 2

Example:

1<table border="2" cellpadding="2" cellspacing="10">


2 <thead>
3 <td><span>Name</span></td>
4 <td><span>Email Id</span></td>
5 </thead>
6 <tr>
7
8 <td>abc</td>
9 <td>[email protected]</td>
1 </tr>
0 </table>
95. In how many ways can we position an HTML element? Or what are
the permissible values of the position attribute?

To position an HTML element there are five different values:

 static.
 relative.
 fixed.
 absolute.
sticky.
96. How to include javascript code in HTML?

There are two ways we can include javascript code in the HTML

1. Embedded Js: In this, we add the script tag directly in the


HTML document as shown below:
<script> document. Write (“Welcome!”)</script>

Can add the script tag either in the head section of the body section of an
HTML document depending on when you want the script to be loaded.

2. External Js: create a separate javascript file and save it with .js
extension and with the help of src attribute of script tag add
the .js file to the HTML document as shown below:
<script src=”file1.js”></script>

97. What is the significance of <head> and <body> tag in HTML?

The Head and Body tag of HTML have their own significance as below:

Head Body

Describes the metadata or information Describes the documents main content of an HTML
related to the document document
Head Tag contains the title for the Body tag contains all the contents of an HTML
document, and also other tags such as document, defined using different tags such as text,
scripts, styles, links, and meta. hyperlinks, images, tables, lists, etc.

98. Can we display a web page inside a web page or Is nesting of


webpages possible?

Yes, it is possible to create nested pages in an HTML document. We can


use<Iframe> or <embed> tag using src tag one can add URL to the same
page.

You might also like