HTML

 What is HTML?

HTML (Hyper Text Markup Language) is the standard language used to create and structure web pages using elements like headings, paragraphs, images, and links.

What are semantic tags in  HTML 5?

Semantic tags are clearly define the content's meaning :-
Named - : <header>, <footer>, <section>, <article>

Difference between <div> and <span> ?
  • <div> is a block level element  
  •  <span> in a inline element  
 use <div> for layout and <span> for styling part for text 

What is difference between id  and  class  in HTML

    id      :  Unique identifier, used once per page 

    class :  Can be reused on multiple page 

What are tags and attributes in HTML?

    tags           :  Tags in HTML are used to define elements on a web page. They tell the browser how to                           display the content. Most tags come in pairs: an opening tag and a closing tag.  

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

    attributes  : Attributes provide additional information about an HTML element. They are always                                included in the opening tag and usually come in name/value pairs like name="value"

                <a href="https://google.com">Visit Google</a>

                   Here, href is an attribute that specifies the link destination.


 What are Semantic HTML Elements?

     Semantic   :  HTML elements clearly describe their meaning and role in the page layout.

                         Examples of Semantic Elements 

        • <header>
        • <nav>
        • <section>
        • <article>
        • <footer>

How do you create a hyperlink in HTML?

    Use the <a> tag with the href attribute to create a hyperlink.

    <a href="https://example.com">Visit Site</a>


How can you embed an image in HTML?    

    Use the <img> tag with the src attribute to embed an image.

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

    src  specifies the image file path

    alt  provides alternative text if the image doesn't load

What is the role of the tag?

       The <head> tag contains metadata about the HTML document, such as the title, character set, CSS            links, and scripts. It doesn’t display content on the page but helps the browser understand and load         the page properly.

How do you create a table in HTML?

    Use the <table> tag along with <tr>, <th>, and <td> to create a table.

<table>
  <tr>
    <th>Name</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Alice</td>
    <td>25</td>
  </tr>
</table>


How do you create a form in HTML?

        Use the <form> tag along with input elements like <input>, <textarea>, and <button>.

<form action="submit.php" method="post">
    <input type="text" name="username" placeholder="Enter Name">
    <input type="email" name="email" placeholder="Enter Email">
    <button type="submit">Submit</button>
</form>

  • action = where to send the form data
  • method = how to send the data (get or post)

What is the purpose of the attribute in tags?

    The attribute in HTML tags provides additional information or functionality about an element. It’s         used to modify the behavior, appearance, or other properties of HTML tags. Think of attributes like      extra instructions that tell the browser how to handle or display an element.

What are block-level and inline elements? Give examples.

    
    Take up the full width of the page and start on a new line.

        <div>, <p>, <h1>, <section>, <table>

    Take up only as much width as needed and do not break to a new line.

            <span>, <a>, <strong>, <img>, <label>

 How do you create an ordered and unordered list?

       Use the <ol> tag with <li> items.

<ol>
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
</ol>


       Use the <ul> tag with <li> items.

<ul>
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
</ul>

  • <ol> = ordered list

  • <ul> = unordered list

  • <li> = list item

How do you add comments in HTML?

    Use <!-- comment here --> to add comments in HTML.


What is the difference between HTML4 and HTML5?

HTML5 is more powerful, supports multimedia, better structure (semantic tags), and is mobile-friendly compared to HTML4.


How do you embed audio and video in HTML5?

Embed Audio:

Use the <audio> tag with the controls attribute.

<audio controls>
    <source src="audio.mp3" type="audio/mpeg">
    Your browser does not support the audio tag.
</audio>


Embed Video:

Use the <video> tag with the controls attribute.

<video width="320" height="240" controls>
    <source src="video.mp4" type="video/mp4">
    Your browser does not support the video tag.
</video>


✅ controls = shows play, pause, volume buttons
✅ source = defines the media file and its type


What is the purpose of the <title> element?
It sets the title of the web page shown in the browser tab.


What is the purpose of the <form> element?
 It is used to collect and submit user input to the server.

What is the purpose of the <meta> element?
It provides metadata about the HTML document, like character set, author, or viewport settings.



What are HTML5 form validations? Can you name a few new input types?

      HTML5 form validation allows the browser to automatically check user input before submitting the form,         without using JavaScript.
                              
                   Examples of HTML5 Validations:
  • type="email" – must be a valid email 
  • min, max, maxlength – limits values or length 
  •  pattern – regex pattern match
  • required – field must be filled 

               New Input Types in HTML5:

    •  email
    • url
    • tel
    • number
    • range
    • date
    • color

How would you implement lazy loading of images in HTML5?

Use the loading="lazy" attribute in the <img> tag.

It delays loading the image until it’s about to enter the viewport (visible area), which improves page speed.

<img src="image.jpg" alt="Example Image" loading="lazy">


Benefits:

  • Faster initial page load
  • Saves bandwidth
  • Improves performance, especially on long pages

This feature is supported in all modern browsers.


What is a viewport meta tag? Why is it important for responsive design? 

The viewport meta tag is an essential element in web development for controlling how a webpage is displayed on various devices, especially mobile devices. It specifies the visible area of a webpage and enables the layout to adapt based on the device's screen size.

<meta name="viewport" content="width=device-width, initial-scale=1">

Viewport meta tag: Controls how a webpage is displayed on different devices (especially mobile).


How do you link external CSS and JS files in HTML?

































































 

Comments

Post a Comment

Popular posts from this blog

PHP INTERVIEW QUESTIONS

      PHP INTERVIEW QUESTIONS 1. WHAT IS PHP? PHP (Hypertext Preprocessor) is a server site scripting language designed for web development. It is widely used foe creating dynamic and interactive website.  2 . Difference between echo and print? echo is faster then print, can print multiple values,  No return value. print slower, return 1 (true) prints on;y one value echo "Hello", " World!";  // ✅ Works print "Hello", " World!"; // ❌ Error 3. Difference between variable and constants?  Both variables and constants store data, but they behave differently.  variable can changeable constants cannot be modify after declaration  variable have local and global scope, while constants are always global  4. what are the different data type in PHP? PHP has 8 primary data types       Data Type Example Description String "Hello"    Sequence of characters Integer 10    Whole number Float 10.5   ...
Read more

PHP Intermediate Questions Interview Preparation

Level          Type Level                                    Arrays, forms, sessions, cookies, file handling, string/date functions 1. What is a PHP session? ➤ Used to store user data across multiple pages. 2. How do you start a session? ➤ Use session_start(); 3.What is a cookie? ➤ Stores small data on the client-side; use setcookie() . 4. How to send a form using PHP? ➤ Use method="post" or method="get" and handle with $_POST or $_GET . 5. How to upload a file in PHP? ➤ Use enctype="multipart/form-data" and handle with $_FILES . 6. How to handle a checkbox or radio in PHP? ➤ Use isset($_POST['checkbox_name']) to check selection. 7. What is the use of explode() function? ➤ Splits a string into an array using a delimiter. 8. What is implode() ? ➤ Joins array elements into a string. 9. How to redirect a page in PHP? ➤ Using h...
Read more

PHP Interview Questions (Beginner Level) – Short Answers

  🔹 PHP Interview Questions (Beginner Level) – Short Answers What is PHP? → PHP is a server-side scripting language used to create dynamic websites. When and why is it used? → Used for web development to handle forms, sessions, databases, and more. What are the main features of PHP? → Open-source, server-side, platform-independent, supports databases. Difference between echo and print ? → echo is faster and can print multiple values; print returns 1 (used in expressions). How do you declare variables in PHP? → With $ symbol. Example: $name = "John"; What are data types in PHP? → String, Integer, Float, Boolean, Array, Object, NULL. Difference between == and === ? → == compares values, === compares value + data type. What are superglobals? → Built-in global variables like $_GET , $_POST , $_SESSION , etc. How does PHP handle forms (GET vs POST)? → $_GET shows data in URL; $_POST hides data. POST is safer for sensitive data. Diff...
Read more