{"id":26349,"date":"2022-02-07T11:46:52","date_gmt":"2022-02-07T11:46:52","guid":{"rendered":"https:\/\/www.devopsschool.com\/blog\/?p=26349"},"modified":"2022-04-13T16:55:36","modified_gmt":"2022-04-13T16:55:36","slug":"top-50-interview-questions-answers-for-html","status":"publish","type":"post","link":"https:\/\/www.devopsschool.com\/blog\/top-50-interview-questions-answers-for-html\/","title":{"rendered":"Top 50 interview questions and answers for HTML"},"content":{"rendered":"\n<p>Hello folks, today we will discuss some interview question &amp; answers of HTML. But before moving towards our today\u2019s topic of HTML, I would like to discuss here the evolution of HTML. So, the first form of HTML was written by Tim Berners-Lee in the year 1993. Meanwhile then, there have been many diverse versions of HTML. The most extensively used version during the early 2000&#8217;s was HTML 4.01, which became an official standard in December 1999. Alternative version, XHTML, was a revision of HTML as an XML language.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"420\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/What-is-HTML-Code-Used-History-and-Example-1024x420-1.png\" alt=\"\" class=\"wp-image-26394\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/What-is-HTML-Code-Used-History-and-Example-1024x420-1.png 1024w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/What-is-HTML-Code-Used-History-and-Example-1024x420-1-300x123.png 300w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/What-is-HTML-Code-Used-History-and-Example-1024x420-1-768x315.png 768w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption>what is html<\/figcaption><\/figure>\n\n\n\n<p>In designing a website, the HTML is one of the most important features to be kept in mind. The HTML coding commands are very much easier than those of JAVA, PHP, js etc. In a count, many Internet browsers are designed to read HTML simply. The designing a website is not a rocket science task, if a person follows a systematic process. If the steps and processes are not followed then it can become harder than rocket science.<\/p>\n\n\n\n<p>Now, let\u2019s see the top interview questions and FAQ for this! <\/p>\n\n\n\n<p><strong>Top 50 Interview Questions &amp; Answers for HTML:-<\/strong><\/p>\n\n\n\n<ol class=\"wp-block-list\"><li><strong>Explain Meta tags in HTML?<\/strong><\/li><\/ol>\n\n\n\n<ul class=\"wp-block-list\"><li>The Meta tags always go confidential head tag of the HTML page<\/li><li>The Meta tags is always passed as name\/worth pairs<\/li><li>The Meta tags are not showed on the page but envisioned for the browser<\/li><li>The Meta tags can contain information about charm encoding, description, title of the document etc.<\/li><\/ul>\n\n\n\n<p>2. <strong>Can a web page contain multiple &lt;header&gt; elements? What about &lt;footer&gt; elements?<\/strong><\/p>\n\n\n\n<p>I would say \u201cYes\u201d to both of them. The W3 documents says that the tags represent the header (&lt;header&gt;) and footer (&lt;footer&gt;) areas of their nearest forebear &#8220;section&#8221;. So not only the page &lt;body&gt; contain a header and a footer, but every &lt;article&gt; and &lt;section&gt; element of it.<\/p>\n\n\n\n<p>3. <strong>Explain how to indicate the character set being used by a document in HTML?<\/strong><\/p>\n\n\n\n<p>The atmosphere set is defined in &lt;Meta&gt; tag inside &lt;head&gt; element.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-1\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml\"><span class=\"hljs-meta\">&lt;!DOCTYPE <span class=\"hljs-meta-keyword\">html<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">html<\/span>&gt;<\/span>\r\n  \r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">head<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">title<\/span>&gt;<\/span>Charset<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">title<\/span>&gt;<\/span>\r\n      \r\n    <span class=\"hljs-comment\">&lt;!--using-meta-tag---&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">meta<\/span> <span class=\"hljs-attr\">charset<\/span>=<span class=\"hljs-string\">\"UTF-8\"<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">head<\/span>&gt;<\/span>\r\n  \r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">body<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">h2<\/span>&gt;<\/span>Welcome To GFG<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">h2<\/span>&gt;<\/span>\r\n  \r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">p<\/span>&gt;<\/span>\r\n        Here is an example for indicating \r\n        character set in HTML Document.\r\n    <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">p<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">body<\/span>&gt;<\/span>\r\n  \r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">html<\/span>&gt;<\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-1\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>4. <strong>What is the difference between &lt;strong&gt;, &lt;b&gt; tags and &lt;em&gt;, &lt;i&gt; tags?<\/strong><\/p>\n\n\n\n<p>The result on a normal webpage of the tags &lt;strong&gt;, &lt;b&gt; and &lt;em&gt;, &lt;i&gt; is the similar. The &lt;b&gt; and &lt;i&gt; tags attitudes for bold and italic. These two tags only apply font fashioning and bold tag &lt;b&gt;, just adds more ink to the text, these tags say anything about the text.<\/p>\n\n\n\n<p>While, &lt;strong&gt; and &lt;em&gt; tags signify that the span of text is of strong importance or more importance and emphatic stress respectively than the rest of the text. These tags have similar meaning.<\/p>\n\n\n\n<p>5. <strong>What is the work of figcaption tag in HTML 5?<\/strong><\/p>\n\n\n\n<p>The &lt;figcaption&gt; element is used to deliver a caption to an image. It is an elective tag and can appear before or after the content within the &lt;figure&gt; tag. The &lt;figcaption&gt; element is cast-off with &lt;figure&gt; element and it can be placed as the first or last child of the &lt;figure&gt; element.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-2\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">figure<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">img<\/span> <span class=\"hljs-attr\">src<\/span>=<span class=\"hljs-string\">\"\/media\/cc0-images\/elephant-660-480.jpg\"<\/span>\r\n         <span class=\"hljs-attr\">alt<\/span>=<span class=\"hljs-string\">\"Elephant at sunset\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">figcaption<\/span>&gt;<\/span>An elephant at sunset<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">figcaption<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">figure<\/span>&gt;<\/span>\r\n<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-2\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>6. <strong>What is data list tag in HTML?<\/strong><\/p>\n\n\n\n<p>The HTML datalist tag delivers an automatic complete feature on the form element. It enables users to choose the pre-defined selections to the users to select data.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-3\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">label<\/span> <span class=\"hljs-attr\">for<\/span>=<span class=\"hljs-string\">\"browser\"<\/span>&gt;<\/span>Choose your browser from the list:<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">label<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">input<\/span> <span class=\"hljs-attr\">list<\/span>=<span class=\"hljs-string\">\"browsers\"<\/span> <span class=\"hljs-attr\">name<\/span>=<span class=\"hljs-string\">\"browser\"<\/span> <span class=\"hljs-attr\">id<\/span>=<span class=\"hljs-string\">\"browser\"<\/span>&gt;<\/span>\r\n\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">datalist<\/span> <span class=\"hljs-attr\">id<\/span>=<span class=\"hljs-string\">\"browsers\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">option<\/span> <span class=\"hljs-attr\">value<\/span>=<span class=\"hljs-string\">\"Edge\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">option<\/span> <span class=\"hljs-attr\">value<\/span>=<span class=\"hljs-string\">\"Firefox\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">option<\/span> <span class=\"hljs-attr\">value<\/span>=<span class=\"hljs-string\">\"Chrome\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">option<\/span> <span class=\"hljs-attr\">value<\/span>=<span class=\"hljs-string\">\"Opera\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">option<\/span> <span class=\"hljs-attr\">value<\/span>=<span class=\"hljs-string\">\"Safari\"<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">datalist<\/span>&gt;<\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-3\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>7. <strong>What is SVG?<\/strong><\/p>\n\n\n\n<p>The HTML SVG is used to label the two-dimensional vector and vector\/raster graphics. The SVG images and their behaviors that are defined in XML text files. So as XML files, you can make and edit an SVG image with the text editor. It is typically used for vector type diagrams like pie charts, 2-Dimensional graphs in an X, Y coordinate system.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-4\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml\"><span class=\"hljs-meta\">&lt;!DOCTYPE <span class=\"hljs-meta-keyword\">html<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">html<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">body<\/span>&gt;<\/span>\r\n\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">svg<\/span> <span class=\"hljs-attr\">width<\/span>=<span class=\"hljs-string\">\"100\"<\/span> <span class=\"hljs-attr\">height<\/span>=<span class=\"hljs-string\">\"100\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">circle<\/span> <span class=\"hljs-attr\">cx<\/span>=<span class=\"hljs-string\">\"50\"<\/span> <span class=\"hljs-attr\">cy<\/span>=<span class=\"hljs-string\">\"50\"<\/span> <span class=\"hljs-attr\">r<\/span>=<span class=\"hljs-string\">\"40\"<\/span> <span class=\"hljs-attr\">stroke<\/span>=<span class=\"hljs-string\">\"green\"<\/span> <span class=\"hljs-attr\">stroke-width<\/span>=<span class=\"hljs-string\">\"4\"<\/span> <span class=\"hljs-attr\">fill<\/span>=<span class=\"hljs-string\">\"yellow\"<\/span> \/&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">svg<\/span>&gt;<\/span>\r\n\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">body<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">html<\/span>&gt;<\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-4\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>8. <strong>Is audio tag supported in HTML?<\/strong><\/p>\n\n\n\n<p>Yes. It is used to add sound or music files on the web page. There are three supported file formats for HTML 5 audio tag.<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>mp3<\/li><li>WAV<\/li><li>Ogg<\/li><\/ul>\n\n\n\n<p>Let us see the code to play mp3 file using HTML audio tag.<\/p>\n\n\n\n<audio controls>\n  \n  \n  Your browser does not support the audio tag.\n<\/audio>\n\n\n\n<p>9. <strong>What is the use of figure tag in HTML?<\/strong><\/p>\n\n\n\n<p>The figure tag is used to add a photo in the document on the web page. It is used to handle the group of diagrams, photos, code listing with some embedded content.<\/p>\n\n\n\n<p>10. <strong>How to create a hyperlink in HTML?<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"903\" height=\"281\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/how-to-add-image-as-hyperlink-in-html.png\" alt=\"\" class=\"wp-image-26396\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/how-to-add-image-as-hyperlink-in-html.png 903w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/how-to-add-image-as-hyperlink-in-html-300x93.png 300w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/how-to-add-image-as-hyperlink-in-html-768x239.png 768w\" sizes=\"auto, (max-width: 903px) 100vw, 903px\" \/><\/figure>\n\n\n\n<p>The HTML provides an anchor tag to create a hyperlink that links one page to another page. These tags can appear in any of the following ways:<\/p>\n\n\n\n<p>Unvisited link &#8211; It is displayed, underlined and blue.<\/p>\n\n\n\n<p>Visited link &#8211; It is displayed, underlined and purple.<\/p>\n\n\n\n<p>Active link &#8211; It is displayed, underlined and red.<\/p>\n\n\n\n<p>11. <strong>What is semantic HTML?<\/strong><\/p>\n\n\n\n<p>Semantic HTML is a coding style. It is the use of HTML markup to reinforce the semantics or meaning of the content. For example: In semantic HTML &lt;b&gt; &lt;\/b&gt; tag is not used for bold statement as well as &lt;i&gt; &lt;\/i&gt; tag is used for italic. Instead of these we use &lt;strong&gt;&lt;\/strong&gt; and &lt;em&gt;&lt;\/em&gt; tags.<\/p>\n\n\n\n<p>12. <strong>How to create a nested webpage in HTML?<\/strong><\/p>\n\n\n\n<p>The HTML iframe tag is used to display a nested webpage. In other words, it represents a webpage within a webpage. The HTML &lt;iframe&gt; tag defines an inline frame. For example:<\/p>\n\n\n\n<p>13. <strong>Does a hyperlink only apply to text?<\/strong><\/p>\n\n\n\n<p>No, you can use hyperlinks on text and images both. The HTML anchor tag defines a hyperlink that links one page to another page. The &#8220;href&#8221; attribute is the most important attribute of the HTML anchor tag.<\/p>\n\n\n\n<p>14. <strong>What is the use of a span tag? Give one example.<\/strong><\/p>\n\n\n\n<p>The span tag is used for following things:<\/p>\n\n\n\n<p>For adding color on text<\/p>\n\n\n\n<p>For adding background on text<\/p>\n\n\n\n<p>Highlight any color text<\/p>\n\n\n\n<p>15. <strong>Why is a URL encoded in HTML?<\/strong><\/p>\n\n\n\n<p>An URL is encoded to convert non-ASCII characters into a format that can be used over the Internet because a URL is sent over the Internet by using the ASCII character-set only. If a URL contains characters outside the ASCII set, the URL has to be converted. The non-ASCII characters are replaced with a &#8220;%&#8221; followed by hexadecimal digits.<\/p>\n\n\n\n<p>16. <strong>How to insert an image in HTML?<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"960\" height=\"659\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/Insert-Images-with-HTML-Part-2-Step-3.jpg\" alt=\"\" class=\"wp-image-26397\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/Insert-Images-with-HTML-Part-2-Step-3.jpg 960w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/Insert-Images-with-HTML-Part-2-Step-3-300x206.jpg 300w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/Insert-Images-with-HTML-Part-2-Step-3-768x527.jpg 768w\" sizes=\"auto, (max-width: 960px) 100vw, 960px\" \/><\/figure>\n\n\n\n<p>&lt;img&gt; tag is used to add an image in a web page.<\/p>\n\n\n\n<p>Images are not inserted into a web page basically they are linked to web pages. The &lt;img&gt; tag helps to create a holding space for the referenced image.<\/p>\n\n\n\n<p>The &lt;img&gt; tag is normally empty, it has attributes only, and does not have a closing tag.<\/p>\n\n\n\n<p>&nbsp;&lt;img&gt; tag has two required parameters:<\/p>\n\n\n\n<p>src \u2013 The path to the image<\/p>\n\n\n\n<p>alt \u2013 An alternate text for the image<\/p>\n\n\n\n<p>To insert a image in html you need to use img tag:<\/p>\n\n\n\n\n\n<p>17. <strong>How to align text in HTML?<\/strong><\/p>\n\n\n\n<p>Basically, if you want to align your text using HTML, then you need to use css and follow the proper process:<\/p>\n\n\n\n\n\n<p>The text-align property discusses the horizontal alignment of text in an element.<\/p>\n\n\n\n<p>18. <strong>How to create a table in HTML?<\/strong><\/p>\n\n\n\n<p>HTML tables help web developers to set the data into rows and columns.<\/p>\n\n\n\n<p>The &lt;table&gt; tag is there in the HTML table.<\/p>\n\n\n\n<p>Each table row can be defined with a &lt;tr&gt; tag.<\/p>\n\n\n\n<p>Each header can be defined with a &lt;th&gt; tag.<\/p>\n\n\n\n<p>Each data or the cell is defined with a &lt;td&gt; tag.<\/p>\n\n\n\n<p>If your text is in the&nbsp; &lt;th&gt; elements then they will be bold and centered.<\/p>\n\n\n\n<p>If your text is in the &lt;td&gt; elements then they will be regular and left-aligned.<\/p>\n\n\n\n\n\n<p>16. <strong>How to convert HTML to PDF?<\/strong><\/p>\n\n\n\n<p>If you are working in a Windows system then&nbsp; open an HTML web page in Internet Explorer, Google Chrome or Firefox.<\/p>\n\n\n\n<p>On a Mac, open an HTML web page in Firefox<\/p>\n\n\n\n<p>Press on the \u201cConvert to PDF\u201d button in the Adobe PDF toolbar in order to get&nbsp; started with the PDF conversion<\/p>\n\n\n\n<p>Enter the filename and save your new PDF file in a desired location.<\/p>\n\n\n\n<p>17. <strong>What is dom in HTML?<\/strong><\/p>\n\n\n\n<p>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.<\/p>\n\n\n\n<p>18. HTML DOM describes:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>The HTML elements as objects<\/li><li>Properties of all HTML elements<\/li><li>Methods of all HTML elements<\/li><li>Events of all HTML elements<\/li><\/ul>\n\n\n\n<p>19. <strong>How to create form in HTML?<\/strong><\/p>\n\n\n\n\n\n<p>20. <strong>How to create button in HTML?<\/strong><\/p>\n\n\n\n\n\n<p>21. <strong>How to save HTML file?<\/strong><\/p>\n\n\n\n<p>In order to save html file<\/p>\n\n\n\n<p>On the main menu<\/p>\n\n\n\n<p>click File &gt; Save As<\/p>\n\n\n\n<p>Right-click within the HTML document<\/p>\n\n\n\n<p>click File &gt; Save As<\/p>\n\n\n\n<p>In the Save As dialog box, specify the file name and location, then click Save<\/p>\n\n\n\n<p>22. <strong>How to select multiple options from a drop down list in HTML?<\/strong><\/p>\n\n\n\n\n\n<p>23. <strong>How to use div tag in html to divide the page?<\/strong><\/p>\n\n\n\n<p>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.&nbsp; Div tag has two parts like:<\/p>\n\n\n\n<p>open(&lt;div&gt;) and<\/p>\n\n\n\n<p>&nbsp;closing (&lt;\/div&gt;) tag and it is mandatory to maintain the tag.<\/p>\n\n\n\n<p>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.<\/p>\n\n\n\n<p>Div tag is Block level tag<\/p>\n\n\n\n<p>Generic container tag<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-5\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript\">&lt;div <span class=\"hljs-class\"><span class=\"hljs-keyword\">class<\/span><\/span>=<span class=\"hljs-string\">\"split left\"<\/span>&gt;\r\n  <span class=\"xml\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"centered\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">img<\/span> <span class=\"hljs-attr\">src<\/span>=<span class=\"hljs-string\">\"img_avatar2.png\"<\/span> <span class=\"hljs-attr\">alt<\/span>=<span class=\"hljs-string\">\"Avatar woman\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">h2<\/span>&gt;<\/span>Jane Flex<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">h2<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">p<\/span>&gt;<\/span>Some text.<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">p<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/span>\r\n\r\n<span class=\"xml\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"split right\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"centered\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">img<\/span> <span class=\"hljs-attr\">src<\/span>=<span class=\"hljs-string\">\"img_avatar.png\"<\/span> <span class=\"hljs-attr\">alt<\/span>=<span class=\"hljs-string\">\"Avatar man\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">h2<\/span>&gt;<\/span>John Doe<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">h2<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">p<\/span>&gt;<\/span>Some text here too.<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">p<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-5\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>24. <strong>How to create drop down list in HTML?<\/strong><\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-6\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"dropdown\"<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">button<\/span> <span class=\"hljs-attr\">onclick<\/span>=<span class=\"hljs-string\">\"myFunction()\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"dropbtn\"<\/span>&gt;<\/span>Dropdown<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">button<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">id<\/span>=<span class=\"hljs-string\">\"myDropdown\"<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"dropdown-content\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">a<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\">\"#\"<\/span>&gt;<\/span>Link 1<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">a<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">a<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\">\"#\"<\/span>&gt;<\/span>Link 2<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">a<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">a<\/span> <span class=\"hljs-attr\">href<\/span>=<span class=\"hljs-string\">\"#\"<\/span>&gt;<\/span>Link 3<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">a<\/span>&gt;<\/span>\r\n  <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-6\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>25. <strong>How to add a link in HTML?<\/strong><\/p>\n\n\n\n<p>To add links in html we use &lt;a&gt; and &lt;\/a&gt; tags,&nbsp; which are the tags used to define the links. The &lt;a&gt; tag indicates where the hyperlink starts and the &lt;\/a&gt; 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 &lt;a href=\u201d \u201d&gt;.<\/p>\n\n\n\n<p>26. <strong>What is a marquee?<\/strong><\/p>\n\n\n\n<p>Marquee is used for the scrolling text on a web page. It scrolls the image or text up, down, left or right automatically. You should put the text which you want to scroll within the &lt;marquee&gt;\u2026\u2026&lt;\/marquee&gt; tag.<\/p>\n\n\n\n<p>27. <strong>What is the use of an iframe tag?<\/strong><\/p>\n\n\n\n<p>An iframe is used to display a web page within a web page.<\/p>\n\n\n\n<p>Syntax:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-7\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">iframe<\/span> <span class=\"hljs-attr\">src<\/span>=<span class=\"hljs-string\">\"URL\"<\/span> <span class=\"hljs-attr\">title<\/span>=<span class=\"hljs-string\">\"description\"<\/span>&gt;<\/span><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">iframe<\/span>&gt;<\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-7\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>Example:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-8\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml\"><span class=\"hljs-meta\">&lt;!DOCTYPE <span class=\"hljs-meta-keyword\">html<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">html<\/span>&gt;<\/span>\r\n  \r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">head<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">title<\/span>&gt;<\/span>HTML iframe Tag<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">title<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">head<\/span>&gt;<\/span>\r\n  \r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">body<\/span> <span class=\"hljs-attr\">style<\/span>=<span class=\"hljs-string\">\"text-align: center\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">h1<\/span>&gt;<\/span>GeeksforGeeks<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">h1<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">h2<\/span>&gt;<\/span>HTML iframe Tag<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">h2<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">iframe<\/span> <span class=\"hljs-attr\">src<\/span>=\r\n<span class=\"hljs-string\">\"https:\/\/ide.geeksforgeeks.org\/index.php\"<\/span> \r\n            <span class=\"hljs-attr\">height<\/span>=<span class=\"hljs-string\">\"200\"<\/span> \r\n            <span class=\"hljs-attr\">width<\/span>=<span class=\"hljs-string\">\"400\"<\/span>&gt;<\/span>\r\n          \r\n    <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">iframe<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">body<\/span>&gt;<\/span>\r\n  \r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">html<\/span>&gt;<\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-8\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>28. <strong>What happens if you open the external CSS file in a browser?<\/strong> <\/p>\n\n\n\n<p>When you try to open the external CSS file in a browser, the browser cannot open the file, because the file has a different extension. The only way to use an external CSS file is to reference it using &lt;link\/&gt; tag within another HTML document.<\/p>\n\n\n\n<p>29. <strong>Write an HTML table tag sequence that outputs the following:<\/strong><\/p>\n\n\n\n<p><strong>50 pcs 100 500<\/strong><\/p>\n\n\n\n<p><strong>10 pcs 5 50<\/strong><\/p>\n\n\n\n<p>The HTML Code for the above problem is:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-9\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">table<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">tr<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">td<\/span>&gt;<\/span>50 pcs<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">td<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">td<\/span>&gt;<\/span>100<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">td<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">td<\/span>&gt;<\/span>500<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">td<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">tr<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">tr<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">td<\/span>&gt;<\/span>10 pcs<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">td<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">td<\/span>&gt;<\/span>5<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">td<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">td<\/span>&gt;<\/span>50<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">td<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">tr<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">table<\/span>&gt;<\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-9\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>30. <strong>How many types of CSS can be included in HTML?<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/types-of-css.jpg\" alt=\"\" class=\"wp-image-26398\" width=\"767\" height=\"357\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/types-of-css.jpg 674w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2022\/02\/types-of-css-300x140.jpg 300w\" sizes=\"auto, (max-width: 767px) 100vw, 767px\" \/><\/figure>\n\n\n\n<p>There are three ways to include the CSS with HTML:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Inline CSS: It is used for styling small contexts. To use inline styles add the style attribute in the relevant tag.<\/li><li>External Style Sheet: This is used when the style is applied to many pages. Each page must link to the style sheet using the &lt;link&gt; tag. The &lt;link&gt; tag goes inside the head section.<\/li><li>Internal Style Sheet: It is used when a single document has a unique style. Internal styles sheet needs to put in the head section of an HTML page, by using the &lt;style&gt; tag.<\/li><\/ul>\n\n\n\n<p>31. <strong>What do you mean by HTML attribute?<\/strong><\/p>\n\n\n\n<p>Additional information given with the elements is known as an attribute. For Eg<\/p>\n\n\n\n<p>32. <strong>What are the web sockets?<\/strong> <\/p>\n\n\n\n<p>Web Sockets is a next-generation bidirectional communication technology for web applications that operates over a single socket and is exposed via a JavaScript interface in HTML 5 compliant browsers<\/p>\n\n\n\n<p>33. <strong>How are comments added in HTML?<\/strong><\/p>\n\n\n\n<p>The comment tag (&lt;!\u2013 Comment \u2013&gt;) is used to insert comments in the HTML code.<\/p>\n\n\n\n<p>Types of HTML Comments: There are three types of comments in HTML which are:<\/p>\n\n\n\n<p>Single-line comment<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-10\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml\"><span class=\"hljs-meta\">&lt;!DOCTYPE <span class=\"hljs-meta-keyword\">html<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">html<\/span> <span class=\"hljs-attr\">lang<\/span>=<span class=\"hljs-string\">\"en\"<\/span>&gt;<\/span>\r\n \r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">head<\/span>&gt;<\/span>\r\n    <span class=\"hljs-comment\">&lt;!--Meta data--&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">meta<\/span> <span class=\"hljs-attr\">charset<\/span>=<span class=\"hljs-string\">\"UTF-8\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">meta<\/span> <span class=\"hljs-attr\">http-equiv<\/span>=<span class=\"hljs-string\">\"X-UA-Compatible\"<\/span>\r\n          <span class=\"hljs-attr\">content<\/span>=<span class=\"hljs-string\">\"IE=edge\"<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">meta<\/span> <span class=\"hljs-attr\">name<\/span>=<span class=\"hljs-string\">\"viewport\"<\/span>\r\n          <span class=\"hljs-attr\">content<\/span>=<span class=\"hljs-string\">\"width=device-width, initial-scale=1.0\"<\/span>&gt;<\/span>\r\n \r\n    <span class=\"hljs-comment\">&lt;!--The description written on title tag\r\n        get appeared as browser tab name--&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">title<\/span>&gt;<\/span>Geeks For Geeks <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">title<\/span>&gt;<\/span>\r\n \r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">style<\/span>&gt;<\/span><span class=\"css\">\r\n        <span class=\"hljs-selector-tag\">h1<\/span> {\r\n            <span class=\"hljs-attribute\">color<\/span>: <span class=\"hljs-number\">#006600<\/span>;\r\n            <span class=\"hljs-attribute\">text-align<\/span>: center;\r\n<span class=\"hljs-attribute\">border<\/span>: <span class=\"hljs-number\">2px<\/span> solid <span class=\"hljs-number\">#091418<\/span>;\r\n            <span class=\"hljs-attribute\">background-color<\/span>: yellow;\r\n        }\r\n        <span class=\"hljs-selector-class\">.container<\/span> {\r\n            <span class=\"hljs-attribute\">border<\/span>: <span class=\"hljs-number\">2px<\/span> solid <span class=\"hljs-number\">#040804<\/span>;\r\n            <span class=\"hljs-attribute\">background-color<\/span>: slategray;\r\n        }\r\n        <span class=\"hljs-selector-tag\">p<\/span>{\r\n            <span class=\"hljs-attribute\">border<\/span>: <span class=\"hljs-number\">2px<\/span> solid <span class=\"hljs-number\">#040804<\/span>;\r\n            <span class=\"hljs-attribute\">background-color<\/span>:  <span class=\"hljs-number\">#4089c5<\/span>;\r\n        }\r\n<\/span><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">style<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">head<\/span>&gt;<\/span>\r\n   \r\n<span class=\"hljs-comment\">&lt;!-- Whatever content in the body tag\r\n     appears on the webpage --&gt;<\/span>\r\n \r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">body<\/span>&gt;<\/span>\r\n    <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">div<\/span> <span class=\"hljs-attr\">class<\/span>=<span class=\"hljs-string\">\"container\"<\/span> &gt;<\/span>\r\n        <span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">h1<\/span>&gt;<\/span>Geeks for Geeks(h1) <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">h1<\/span>&gt;<\/span>\r\n         \r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">p<\/span>&gt;<\/span>\r\n             This is a paragraph example of block\r\n             element which occupied whole width (p)\r\n        <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">p<\/span>&gt;<\/span>\r\n \r\n    <span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">div<\/span>&gt;<\/span>\r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">body<\/span>&gt;<\/span>\r\n \r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">html<\/span>&gt;<\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-10\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>34. <strong>What is the difference between block and inline elements?<\/strong><\/p>\n\n\n\n<p>Every element in HTML has a default display value which depends upon the element type. Block or inline are the default display value for the most of the elements.<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Block Level Elements: A block-level element always starts on a new line and stretches out to the left and right as far as it can.<\/li><\/ul>\n\n\n\n<p>Div element: The div element is used as a container for other HTML elements. It has no required attributes. Style, class and id are the commonly used attributes<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Inline Elements: An inline element is the opposite of the block-level element. It does not start on a new line and takes up only necessary width.<\/li><\/ul>\n\n\n\n<ul class=\"wp-block-list\"><li>span element: The span element is used as a container for text. It has no required attributes. Style, class and id are the commonly used attributes.<\/li><\/ul>\n\n\n\n<p>35. <strong>What is the \u2018class\u2019 attribute in HTML?<\/strong><\/p>\n\n\n\n<p>The class attribute is used to specify the class name for an HTML element. Multiple elements in HTML can have the same class value. Also, it is mainly used to associate the styles written in the stylesheet with the HTML elements.<\/p>\n\n\n\n<p>36. <strong>What is the difference between the \u2018id\u2019 attribute and the \u2018class\u2019 attribute of HTML elements?<\/strong><\/p>\n\n\n\n<p>Multiple elements in HTML can have the same class value, whereas a value of id attribute of one element cannot be associated with another HTML element.<\/p>\n\n\n\n<p>37. <strong>Define multipart form data?<\/strong><\/p>\n\n\n\n<p>Multipart form data is one of the values of the enctype attribute. It is used to send the file data to the server-side for processing. The other valid values of the enctype attribute are text\/plain and application\/x-www-form-urlencoded.<\/p>\n\n\n\n<p>38. <strong>Describe HTML layout structure.<\/strong><\/p>\n\n\n\n<p>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:<\/p>\n\n\n\n<p>&lt;header&gt;: Stores the starting information about the web page.<\/p>\n\n\n\n<p>&lt;footer&gt;: Represents the last section of the page.<\/p>\n\n\n\n<p>&lt;nav&gt;: The navigation menu of the HTML page.<\/p>\n\n\n\n<p>&lt;article&gt;: It is a set of information.<\/p>\n\n\n\n<p>&lt;section&gt;: It is used inside the article block to define the basic structure of a page.<\/p>\n\n\n\n<p>&lt;aside&gt;: Sidebar content of the page.<\/p>\n\n\n\n<p>39. <strong>How to optimize website assets loading?<\/strong><\/p>\n\n\n\n<p>To optimize website load time we need to optimize its asset loading and for that:<\/p>\n\n\n\n<p>CDN hosting &#8211; A CDN or content delivery network is geographically distributed servers to help reduce latency.<\/p>\n\n\n\n<p>File compression &#8211; This is a method that helps to reduce the size of an asset to reduce the data transfer<\/p>\n\n\n\n<p>File concatenation &#8211; This reduces the number of HTTP calls<\/p>\n\n\n\n<p>Minify scripts &#8211; This reduces the overall file size of js and CSS files<\/p>\n\n\n\n<p>Parallel downloads &#8211; Hosting assets in multiple subdomains can help to bypass the download limit of 6 assets per domain of all modern browsers. This can be configured but most general users never modify these settings.<\/p>\n\n\n\n<p>Lazy Loading &#8211; Instead of loading all the assets at once, the non-critical assets can be loaded on a need basis.<\/p>\n\n\n\n<p>40. <strong>What are the various formatting tags in HTML?<\/strong><\/p>\n\n\n\n<p>&nbsp;HTML has various formatting tags:<\/p>\n\n\n\n<p>&lt;b&gt; &#8211; makes text bold<\/p>\n\n\n\n<p>&lt;i&gt; &#8211; makes text italic<\/p>\n\n\n\n<p>&lt;em&gt; &#8211; makes text italic but with added semantics importance<\/p>\n\n\n\n<p>&lt;big&gt; &#8211; increases the font size of the text by one unit<\/p>\n\n\n\n<p>&lt;small&gt; &#8211; decreases the font size of the text by one unit<\/p>\n\n\n\n<p>&lt;sub&gt; &#8211; makes the text a subscript<\/p>\n\n\n\n<p>&lt;sup&gt; &#8211; makes the text a superscript<\/p>\n\n\n\n<p>&lt;del&gt; &#8211; displays as strike out text<\/p>\n\n\n\n<p>&lt;strong&gt; &#8211; marks the text as important<\/p>\n\n\n\n<p>&lt;mark&gt; &#8211; highlights the text<\/p>\n\n\n\n<p>&lt;ins&gt; &#8211; displays as added text<\/p>\n\n\n\n<p>41. <strong>What are the different kinds of Doctypes available?<\/strong><\/p>\n\n\n\n<p>The three kinds of Doctypes which are available:<\/p>\n\n\n\n<p>Strict Doctype<\/p>\n\n\n\n<p>Transitional Doctype<\/p>\n\n\n\n<p>Frameset Doctype<\/p>\n\n\n\n<p>42. <strong>Please explain how to indicate the character set being used by a document in HTML?<\/strong><\/p>\n\n\n\n<p>The character set is defined in &lt;meta&gt; tag inside &lt;head&gt; element.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-11\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">meta<\/span> <span class=\"hljs-attr\">http-equiv<\/span>=<span class=\"hljs-string\">\"Content-Type\"<\/span> <span class=\"hljs-attr\">content<\/span>=<span class=\"hljs-string\">\"text\/html; charset=UTF-8\"<\/span>&gt;<\/span>\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">meta<\/span> <span class=\"hljs-attr\">charset<\/span>=<span class=\"hljs-string\">\"UTF-8\"<\/span>&gt;<\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-11\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>43. <strong>What is the difference between &lt;strong&gt;, &lt;b&gt; tags and &lt;em&gt;, &lt;i&gt; tags?<\/strong><\/p>\n\n\n\n<p>The effect on a normal webpage of the tags &lt;strong&gt;, &lt;b&gt;&nbsp; and &lt;em&gt;, &lt;i&gt; is the same. &lt;b&gt; and &lt;i&gt; tags stands for bold and italic. These two tags only apply font styling and bold tag &lt;b&gt;, just adds more ink to the text, these tags don&#8217;t say anything about the text.<\/p>\n\n\n\n<p>Whereas, &lt;strong&gt; and &lt;em&gt; tags represent that the span of text is of strong importance or more importance and emphatic stress respectively than the rest of the text. These tags have semantic meaning.<\/p>\n\n\n\n<p>44. <strong>What is the significance of &lt;head&gt; and &lt;body&gt; tag in HTML?<\/strong><\/p>\n\n\n\n<p>&lt;head&gt; tag provides the information about the document. It should always be enclosed in the &lt;html&gt; tag. This tag contains the metadata about the webpage and the tags which are enclosed by head tag like &lt;link&gt;, &lt;meta&gt;, &lt;style&gt;, &lt;script&gt;, etc. are not displayed on the web page. Also, there can be only 1 &lt;head&gt; tag in the entire Html document and will always be before the &lt;body&gt; tag.<\/p>\n\n\n\n<p>&lt;body&gt; tag defines the body of the HTML document. It should always be enclosed in the &lt;html&gt; tag. All the contents which needs to be displayed on the web page like images, text, audio, video, contents, using elements like &lt;p&gt;, &lt;img&gt;, &lt;audio&gt;, &lt;heading&gt;, &lt;video&gt;, &lt;div&gt;, etc. will always be enclosed by the &lt;body&gt; tag. Also, there can be only 1 body element in an HTML document and will always be after the &lt;head&gt; tag.<\/p>\n\n\n\n<p>45. <strong>Can we display a web page inside a web page or Is nesting of webpages possible?<\/strong><\/p>\n\n\n\n<p>Yes, we can display a web page inside another HTML web page. HTML provides a tag &lt;iframe&gt; using which we can achieve this functionality.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-12\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml\"><span class=\"hljs-meta\">&lt;!DOCTYPE <span class=\"hljs-meta-keyword\">html<\/span>&gt;<\/span>    \r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">html<\/span>&gt;<\/span>    \r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">body<\/span>&gt;<\/span>    \r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">h2<\/span>&gt;<\/span>HTML Iframes example<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">h2<\/span>&gt;<\/span>    \r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">p<\/span>&gt;<\/span>Use the height and width attributes to specify the size of the iframe:<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">p<\/span>&gt;<\/span>    \r\n<span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">iframe<\/span> <span class=\"hljs-attr\">src<\/span>=<span class=\"hljs-string\">\"https:\/\/www.devopsschool.com\/\"<\/span> <span class=\"hljs-attr\">height<\/span>=<span class=\"hljs-string\">\"300\"<\/span> <span class=\"hljs-attr\">width<\/span>=<span class=\"hljs-string\">\"400\"<\/span>&gt;<\/span><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">iframe<\/span>&gt;<\/span>    \r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">body<\/span>&gt;<\/span>    \r\n<span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">html<\/span>&gt;<\/span>  <\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-12\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>46. <strong>How is Cell Padding different from Cell Spacing?<\/strong><\/p>\n\n\n\n<p>Cell Spacing is the space or gap between two consecutive cells. Whereas, Cell Padding is the space or gap between the text\/ content of the cell and the edge\/ border of the cell. Please refer to the above figure example to find the difference.<\/p>\n\n\n\n<p>47. <strong>How can we club two or more rows or columns into a single row or column in an HTML table?<\/strong><\/p>\n\n\n\n<p>HTML provides two table attributes \u201crowspan\u201d and \u201ccolspan\u201d to make a cell span to multiple rows and columns respectively.<\/p>\n\n\n\n<p>48. <strong>&nbsp;Is it possible to change an inline element into a block level element?<\/strong><\/p>\n\n\n\n<p>Yes, it is possible using the \u201cdisplay\u201d property with its value as \u201cblock\u201d, to change the inline element into a block-level element.<\/p>\n\n\n\n<p>49. <strong>How many ways you can display HTML elements?<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Inline: Using this we can display any block-level element as an inline element. The height and width attribute values of the element will not affect.<\/li><li>Block: using this, we can display any inline element as a block-level element.<\/li><\/ul>\n\n\n\n<ul class=\"wp-block-list\"><li>Inline-block: This property is similar to inline, except by using the display as inline-block, we can actually format the element using height and width values.<\/li><li>Flex: It displays the container and element as a flexible structure. It follows flexbox property.<\/li><li>Inline-flex: It displays the flex container as an inline element while its content follows the flexbox properties.<\/li><li>Grid: It displays the HTML elements as a grid container.<\/li><li>None: Using this property we can hide the HTML element.<\/li><\/ul>\n\n\n\n<p>50. <strong>When to use scripts in the head and when to use scripts in the body?<\/strong><\/p>\n\n\n\n<p>If the scripts comprise some event-triggered functions or jquery library then we should use them in the head section. If the script inscribes the gratified on the page or is not inside a function then it should be placed inside the body section at the bottom. In short, follow below three points:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Place library scripts or event scripts in the head section.<\/li><li>Place normal scripts that do not write anything on the page, in the head section until there is any performance issue.<\/li><li>Place scripts that render something on the web page at the bottom of the body section.<\/li><\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Hello folks, today we will discuss some interview question &amp; answers of HTML. But before moving towards our today\u2019s topic of HTML, I would like to discuss here the evolution of HTML. So, the first form of HTML was written by Tim Berners-Lee in the year 1993. Meanwhile then, there have been many diverse versions&#8230;<\/p>\n","protected":false},"author":1,"featured_media":26395,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","_joinchat":[],"footnotes":""},"categories":[4864],"tags":[7139,7151,7148,7150,5449,296,4459,7144,7143,7169,7145,7146,7137,7142,7149,7140,7138,7147],"class_list":["post-26349","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-html","tag-alternate-of-html","tag-best-html-certification-onlne","tag-best-institute-for-html","tag-career-option-with-html","tag-devopsschool","tag-features","tag-html","tag-html-benefits","tag-html-certification","tag-html-faq","tag-html-training","tag-html-training-online","tag-html-works","tag-interview-questions-of-html","tag-pay-scale-of-html","tag-resources-of-html","tag-uses-of-html","tag-video-tutorial-of-html"],"_links":{"self":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/26349","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/comments?post=26349"}],"version-history":[{"count":6,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/26349\/revisions"}],"predecessor-version":[{"id":26399,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/26349\/revisions\/26399"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/media\/26395"}],"wp:attachment":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/media?parent=26349"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/categories?post=26349"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/tags?post=26349"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}