Ask your Question

Write to us

Ask Question

Html Interview Questions

  • 1 What is HTML

     HTML stands for HyperText Markup Language. Markup language is used for creating websites and anything that can be viewed in a web browser. The markup tells the Web browser how to display a Web page's words , images and content for the user.

    HTML is a set of Markup tags:

    A markup language is a set of markup tags

    Eample:

    <html>

      <head>

           <title>Page Title</title>

      </head>

    <body>

    <h1>My First Heading</h1>

    <p>My first paragraph.</p>

    </body>

    </html>

     

    The start <> tag is called the opening tag. The end</> tag is called the closing tag.

  • 2 What is DOCTYPE

     The <!DOCTYPE> declaration must be placed in your HTML document, before the <html> tag. It gives the instruction to the web browser about what version of HTML the page is written in.

  • 3 What are the different versions of HTML

      HTML version are HTML, HTML+, HTML 2.0, HTML 3.2, HTML 4.0 and the latest version of is HTML 5.

  • 4 What are HTML Elements

     HTML elements are written with a start tag, with an end tag, with the content in between:

    <tagname>Hello World</tagname>

  • 5 What are HTML Tags

     HTML tags similar to keywords which is surrounded by angle brackets, for example, for paragraph we can use HTML tag(<h1>). HTML tags mostly comes in pair like, <h1>, </h1>

  • 6 What is HTML Attribute

     HTML attribute provide additional information to the HTML Elements. Attributes are always specified in the start tag.

     For example, <font size=”5” color=”green”>, here size and color are html attributes.

  • 7 . Do all HTML tags come in pair

     No, there are single HTML tags that does not need a closing tag.
     Examples are the <br> tag and <img>  tags

  • 8 What are Block-level Elements

     A block-level element always starts on a new line and takes entire space of its parent element (container).
    Browsers typically display the block-level element with new line and takes up the full width.

    Examples of block-level elements:

    <div>

    <h1> - <h6>

     

    <p></p>

  • 9 What are Inline Elements

     An inline element does not start on a new line and only takes up the space bounded by the tags that define the inline element.

    Example:

    <span></span>

    <a></a>

    <img>

  • 10 How to open a link in new tab or window

     To open a link in new tab or window, use the following html code:

    <a href=”http://www.letsknowit.com” target=”_blank”>Welcome to letsknowit.com!</a>

  • 11 How to display right to left text in bidirectional text supporting browser

     : <body dir="trl">Text should go in opposite direction</body>

  • 12 How to create emails links

     To HTML create email links using <a href>

    Example:

    <a href="mailto:youremail@domain.com">Send Email</a>

  • 13 What is Responsive Web Design

     Responsive Web Design makes your web page look good and suitable to work on every device and every screen size, no matter how large or small, mobile or desktop

  • 14 What is HTML5

     HTML5 is the fifth major revision of the standard that defines Hypertext Markup Language (HTML). One of the design goals for HTML5 is to support for multimedia on mobile devices. Other new features in HTML5 include specific functions for embedding graphics, audio, video, and interactive documents

  • 15 Difference between HTML and HTML5

     In HTML 4.01, the <!DOCTYPE> declaration refers to a DTD, because HTML 4.01 was based on SGML. The DTD specifies the rules for the markup language, so that the browsers render the content correctly.

    HTML5 is not based on SGML, and therefore does not require a reference to a DTD.

     

    New HTML5 Elements:

    New semantic elements like <header>, <footer>, <article>, and <section>.

    New form control attributes like number, date, time, calendar, and range.

    New graphic elements: <svg> and <canvas>.

    New multimedia elements: <audio> and <video>

  • 16 Differences Between HTML 4.01 and HTML5

    HTML 4.01

    1. Audio and Video are not part of HTML4 specification.

    2. Vector Graphics is possible with the help of technologies such as VML, Silverlight, Flash etc.

    3. It is almost impossible to get true GeoLocation of user browsing any website especially if it comes to mobile devices.

    4. Browser cache can be used as temporary storage.

    5. Does not allow JavaScript to run in browser. JS runs in same thread as browser interface.

    6. Works with all old browsers

     

    HTML5

    1.  Audio and Videos are integral part of HTML5 specifications e.g. <audio> and<video> tags.

    2.  Vector graphics is integral part of HTML5 e.g.SVG and canvas

    3.  JS GeoLocation API in HTML5 helps identify location of user browsing any website (provided user allows it)

    4.  Application Cache, Web SQL database and Web storage is available as client side storage. Accessible using JavaScript interface in HTML5 compliant browsers.

    5.  Allows JavaScript to run in background. This is possible due to JS Web worker API in HTML5

    6.  Most of modern browser have started supporting HTML5 specification e.g. Firefox, Mozilla, Opera, Chrome, Safari etc.

  • 17 How to define doctype in HTML5

     <!DOCTYPE html>

    <html>

    <head>

                      <title>Doctype declaration in HTML5</title>

    </head>

    <body>

                    <h1>My First Heading</h1>

                    <p>My first paragraph.</p>

    </body>

    </html>

  • 18 Define HTML5 Elements as Block Elements

     Example:

    header, section, footer, aside, nav, main, article, figure {

        display: block;

    }

  • 19 How to disable input in HTML5

     :<input type="text" value="John" disabled>

  • 20 What is header tag in HTML5

     The HTML <header> element represents a group of introductory or navigational aids. The <header> element is usually contain the section's heading (an <h1>-<h6> element or other elements like a logo, wrapped section's header, a search form, and so on).
    You can't placed the <header> tag within a <footer>, <address> or another <header> element

  • 21 What is footer tag in HTML5

     The <footer> tag defines a footer for a document or section.
    A footer typically contains information about the author of the section, copyright data or links to related documents

  • 22 What is HTML5 <figure> and <figcaption> Elements

     : In HTML5 <figure> contain the images and caption grouped together.

    Example:

    <figure>

      <img src="demo.jpg" alt="demo" width="150" height="150">

      <figcaption>Fig1. - Hello, HTML5</figcaption>

    </figure>

    The <img> element defines the image, the <figcaption> element defines the image caption(Content)

  • 23 Which element is no longer supported in HTML5

     <acronym>

    <applet>

    <basefont>

    <big>

    <center>

    <dir>

    <font>

    <frame>

    <frameset>

    <noframes>

    <strike>

    <tt>

  • 24 What is meant by onblur and onfocus in HTML5

     Event attributes

    The onblur attribute hits the moment that the element loses focus

    The onfocus attribute fires the moment that the element gets focus.

    Demo

    <input type="text" value="Search" onfocus="if (this.value=='Search') {this.value='';}"  onblur="if (this.value=='') {this.value='Search';}">

  • 25 How to display the correct HTML5 element for playing video files

     <video width="400" controls>

      <source src="video_name.mp4" type="video/mp4">

      <source src="video_name.ogg" type="video/ogg">

      Your browser does not support HTML5 video.

    </video>

    Note:Text between the <video> and </video> tage will not display video that the browser do not support the <video> element

  • 26 Is type attribute for <script> elements is required in HTML5

     No

  • 27 Which method is used to get the current location of a user in HTML5

     getCurrentPosition()

  • 28 what is contenteditable in html5

     In HTML5 any element can be editable. The contenteditable attribute specifies whether the content of an element is editable or not.

    Example:

    <!DOCTYPE html>

    <html>

      <body>

        <div contentEditable="true">

          This text can be edited by the user.

        </div>

      </body>

    </html>

  • 29 What is SVG

    SVG stands for Scalable Vector Graphics. You can use SVG on the web pretty easily. It looks great on retina displays. SVG has several methods for drawing paths, boxes, circles, text, and graphic images

  • 30 How you draw circle is SVG

     Answer:

    Example

    <!DOCTYPE html>

    <html>

    <body>

    <svg width="300" height="300">

      <circle cx="130" cy="130" r="100"  stroke="green" stroke-width="4" fill="yellow" />

    </svg>

    </body>

    </html>

  • 31 In which format SVG graphics is defined

     SVG graphics is defined in XML format

  • 32 How to specify that an input field must be filled out in HTML5

     Required attribute When present, it specifies that an input field must be filled out before submitting the form.

    Example:

    <input type="text" name="usrname" required>

  • 33 What is readonly attribute in input

    The readonly attribute specifies that the input field is read only (cannot be changed)

    Example:

    <form action="">

                    Your  name:<br>

                    <input type="text" name="your name" value="your name" readonly>

    </form>

  • 34 What is disabled attribute in input

     The readonly attribute specifies that the input field is diabled, you can't change anything.

    Example:

    <form action="">

                    Your  name:<br>

                    <input type="text" name="your name" value="your name" disabled>

    </form>

  • 35 How to get autofocus in input fields

     Your  name:<input type="text" name="fname" autofocus>

  • 36 How to alert message on button click

     button type="button" onclick="alert('Hello Superman!')">Hey Click Me!</button>

  • 37 What is Local Storage in HTML5

     HTML5 Local Storage,web applications can store data locally within the user's browser. The localStorage property allows you to access a local Storage. Before that application data has to be stored in cookies, Local Store is more secure and store large amount of data, without affecting website performance.

    Syntax:

    myStorage = localStorage;

     

    Example:

     

    localStorage.setItem('myDog', 'harry');