101 HTML/CSS Freshers Interview Questions With Answers | Crack Interview Easy For freshers

1. What is HTML?

   • HTML stands for HyperText Markup Language, which is used to create and structure content for the web.

2. What is CSS?

   • CSS stands for Cascading Style Sheets, which is used to add style and design to HTML content.

3. What is the difference between HTML and CSS?

   • HTML is used for content and structure, while CSS is used for design and layout.

4. What is a tag in HTML?

   • A tag in HTML is a piece of code that identifies a specific element or function within a web page.

5. What is the syntax for creating a hyperlink in HTML?

   • <a href="url">link text</a>

6. What is the syntax for adding an image in HTML?

   • <img src="image URL" alt="image description">

7. What is a class in CSS?

   • A class in CSS is a way of identifying and applying a specific style or design to a group of elements within an HTML document.

8. What is an ID in CSS?

   • An ID in CSS is a way of identifying and applying a specific style or design to a single element within an HTML document.

9. What is the difference between a class and an ID in CSS?

   • A class can be used to apply a style to multiple elements, while an ID is used to apply a style to a single element.

10. What is the syntax for creating a class in CSS?

    • .class-name { CSS code }

11. What is the syntax for creating an ID in CSS?

    • #id-name { CSS code }

12. What is the box model in CSS?

    • The box model in CSS describes the layout of an element on a web page, including its content, padding, border, and margin.

13. What is the difference between padding and margin in CSS?

    • Padding is the space between an element's content and its border, while margin is the space between an element's border and the next element.

14. What is the difference between inline and block elements in HTML?

    • Inline elements are displayed on the same line, while block elements are displayed on a new line.

15. What is the syntax for creating a comment in HTML?

    • <!-- comment text -->

16. What is the syntax for creating a comment in CSS?

    • /* comment text */

17. What is a selector in CSS?

    • A selector in CSS is a way of targeting a specific element or group of elements within an HTML document.

18. What is the syntax for selecting a class in CSS?

    • .class-name {}

19. What is the syntax for selecting an ID in CSS?

    • #id-name {}

20. What is the difference between the div and span elements in HTML?

    • The div element is a block-level element used for grouping and formatting content, while the span element is an inline-level element used for grouping and formatting smaller amounts of content.

21. What is the difference between a relative and absolute URL in HTML?

    • A relative URL is a link that is relative to the current page or document, while an absolute URL is a link that specifies the full URL of the target page or document.

22. What is the difference between the em and strong elements in HTML?

    • The em element is used to indicate emphasis or stress, while the strong element is used to indicate importance or significance.

23. What is the difference between the ol and ul elements in HTML?

• The ol element is used to create ordered lists, while the ul element is used to create unordered lists.

24. 24. What is the difference between a div and a section element in HTML?

        • The div element is a general-purpose container, while the section element is used to group related content together.

    25. What is the difference between the header and nav elements in HTML?

        • The header element is used to group content at the top of a page, while the nav element is used to group navigation links.

    26. What is the difference between the article and main elements in HTML?

        • The article element is used to group self-contained content, while the main element is used to group the primary content of a page.

    27. What is the difference between the footer and address elements in HTML?

        • The footer element is used to group content at the bottom of a page, while the address element is used to indicate contact information for the author or owner of a page.

    28. What is the difference between a class and an attribute in HTML?

        • A class is a way of grouping and styling elements, while an attribute is a way of defining properties or characteristics of an element.

    29. What is the difference between the font-size and line-height properties in CSS?

        • The font-size property sets the size of the text, while the line-height property sets the spacing between lines of text.

    30. What is the difference between the display and visibility properties in CSS?

        • The display property determines how an element is shown on the page, while the visibility property determines whether an element is visible or hidden.

    31. What is the difference between the width and max-width properties in CSS?

        • The width property sets the width of an element, while the max-width property sets the maximum width that an element can have.

    32. What is the difference between the padding and border properties in CSS?

        • The padding property sets the space between an element's content and its border, while the border property sets the border around an element.

    33. What is the difference between the margin and padding properties in CSS?

        • The margin property sets the space between an element's border and the next element, while the padding property sets the space between an element's content and its border.

    34. What is the difference between the float and clear properties in CSS?

        • The float property sets an element to float to the left or right of other content, while the clear property clears any floats that may interfere with the layout.

    35. What is the difference between the position and z-index properties in CSS?

        • The position property sets the position of an element on the page, while the z-index property sets the stacking order of elements.

    36. What is the difference between the font-weight and font-style properties in CSS?

        • The font-weight property sets the weight or thickness of the text, while the font-style property sets whether the text is italic or normal.

    37. What is the difference between the text-align and text-indent properties in CSS?

        • The text-align property sets the horizontal alignment of text, while the text-indent property sets the indentation of the first line of text in a paragraph.

    38. What is the difference between the background-color and background-image properties in CSS?

        • The background-color property sets the color of an element's background, while the background-image property sets an image as the background of an element.

    39. What is the difference between the overflow and text-overflow properties in CSS?

        • The overflow property sets what happens when an element's content overflows its container, while the text-overflow property sets what happens when text is too long to fit in an element.

    40. What is the difference between the box-sizing and box-shadow properties in CSS?

    • The box-sizing property sets whether an element's width and height include its padding and border, while the box shadow property sets a shadow effect around an element.

    41. What is the difference between the border-radius and border-collapse properties in CSS?

        • The border-radius property sets the rounded corners of an element's border, while the border-collapse property sets how the borders of adjacent table cells are combined.

    42. What is the difference between the transform and transition properties in CSS?

        • The transform property sets how an element is transformed or manipulated, while the transition property sets how an element transitions from one state to another.

    43. What is the difference between the justify-content and align-items properties in CSS?

        • The justify-content property sets how flex items are aligned horizontally in a container, while the align-items property sets how flex items are aligned vertically in a container.

    44. What is the difference between the position and top properties in CSS?

        • The position property sets the position of an element on the page, while the top property sets the vertical position of an element relative to its parent element.

    45. What is the difference between the display and position properties in CSS?

        • The display property determines how an element is shown on the page, while the position property sets the position of an element on the page.

    46. What is the difference between the :first-child and :nth-child(n) selectors in CSS?

        • The :first-child selector selects the first child element of its parent, while the :nth-child(n) selector selects the nth child element of its parent.

    47. What is the difference between the > and ~ selectors in CSS?

        • The > selector selects direct child elements of a parent, while the ~ selector selects all sibling elements that follow a specified element.

    48. What is the difference between the :hover and :active selectors in CSS?

        • The :hover selector styles an element when the mouse pointer is over it, while the :active selector styles an element when it is being clicked.

    49. What is the difference between the ::before and ::after pseudo-elements in CSS?

        • The ::before pseudo-element inserts content before the content of an element, while the ::after pseudo-element inserts content after the content of an element.

    50. What is the difference between the em and rem units in CSS?

        • The em unit is based on the font-size of the element, while the rem unit is based on the font-size of the root element.

    51. What is the difference between the <strong> and <b> elements in HTML?

        • The <strong> element is used to indicate that the text is of strong importance, while the <b> element is used to indicate that the text is stylistically bold.

    52. What is the difference between the <i> and <em> elements in HTML?

        • The <i> element is used to indicate that the text is in an alternate voice or mood, while the <em> element is used to indicate that the text is of emphasis.

    53. What is the difference between the <h1> and <h2> elements in HTML?

        • The <h1> element is used for the main heading of a page, while the <h2> element is used for subheadings.

    54. What is the difference between the <ul> and <ol> elements in HTML?

        • The <ul> element is used for an unordered list, while the <ol> element is used for an ordered list.

    55. What is the difference between the <a> and <button> elements in HTML?

        • The <a> element is used for links, while the <button> element is used for clickable buttons.

    56. What is the difference between the <input> and <select> elements in HTML?

    • The <input> element is used for accepting user input, while the <select> element is used for creating a drop-down list of options.

    58. What is the difference between the <img> and <picture> elements in HTML?

        • The <img> element is used to display a single image, while the <picture> element is used to provide alternative versions of an image based on the device's display capabilities.

    59. What is the difference between the src and href attributes in HTML?

        • The src attribute is used to specify the source of an image or a video, while the href attribute is used to specify the destination of a link.

    60. What is the difference between the alt and title attributes in HTML?

        • The alt attribute provides alternative text for an image when it cannot be displayed, while the title attribute provides additional information about an element when the mouse pointer hovers over it.

    61. What is the difference between the <header> and <nav> elements in HTML?

        • The <header> element is used for the introductory content at the top of a page, while the <nav> element is used for navigation links.

    62. What is the difference between the <section> and <article> elements in HTML?

        • The <section> element is used for grouping related content, while the <article> element is used for standalone content that can be distributed independently.

    63. What is the difference between the <main> and <div> elements in HTML?

        • The <main> element is used to represent the main content of a page, while the <div> element is a generic container for grouping content.

    64. What is the difference between the <footer> and <address> elements in HTML?

        • The <footer> element is used for the content at the bottom of a page, while the <address> element is used to display contact information for the author or owner of a document or article.

    65. What is the difference between the GET and POST methods in HTML forms?

        • The GET method is used to retrieve data from a server, while the POST method is used to submit data to a server.

    66. What is the difference between the required and placeholder attributes in HTML forms?

        • The required attribute specifies that a form field must be filled out before the form can be submitted, while the placeholder attribute provides a hint about the expected value of a form field.

    67. What is the difference between the name and id attributes in HTML?

        • The name attribute is used to identify a form field when the form is submitted, while the id attribute is used to identify a unique element in a web page.

    68. What is the difference between the tabindex and accesskey attributes in HTML?

        • The tabindex attribute specifies the order in which form elements are accessed when the user presses the tab key, while the accesskey attribute provides a keyboard shortcut to a form element.

    69. What is the difference between the role and aria-label attributes in HTML?

        • The role attribute specifies the type of element and its function on a web page, while the aria-label attribute provides a text alternative for an element that is not visible on the page.

    70. What is the difference between the media and type attributes in the <link> element in HTML?

        • The media attribute specifies the media type of the linked document, while the type attribute specifies the MIME type of the linked document.

    71. What is the difference between the <header> and <hgroup> elements in HTML?

    • The <header> element is used for introductory content at the top of a page, while the <hgroup> element is used to group heading elements together for styling purposes.
    72. What is the difference between the <time> and <date> elements in HTML?
        
    1. There is no <date> element in HTML, but the <time> element is used to specify a date or time value.

    74. What is the difference between the srcset and sizes attributes in HTML?

        • The srcset attribute provides multiple versions of an image, while the sizes attribute specifies the size of the image on different devices.

    75. What is the difference between the aria-describedby and aria-labelledby attributes in HTML?

        • The aria-describedby attribute provides a text alternative for an element that is not visible on the page, while the aria-labelledby attribute provides a label for an element.

    76. What is the difference between the <datalist> and <select> elements in HTML?

        • The <datalist> element is used to provide a list of suggestions for an input field, while the <select> element is used for creating a drop-down list of options.

    77. What is the difference between the <video> and <audio> elements in HTML?

        • The <video> element is used to display a video on a web page, while the <audio> element is used to play an audio file.

    78. What is the difference between the <b> and <strong> elements in HTML?

        • The <b> element is used for text that should be displayed in bold, while the <strong> element is used to indicate important text.

    79. What is the difference between the <i> and <em> elements in HTML?

        • The <i> element is used for text that should be displayed in italics, while the <em> element is used to emphasize text.

    80. What is the difference between the <u> and <ins> elements in HTML?

        • The <u> element is used for text that should be underlined, while the <ins> element is used to indicate inserted text.

    81. What is the difference between the <s> and <del> elements in HTML?

        • The <s> element is used to indicate text that is no longer accurate, while the <del> element is used to indicate deleted text.

    82. What is the difference between the <sup> and <sub> elements in HTML?

        • The <sup> element is used for superscript text, while the <sub> element is used for subscript text.

    83. What is the difference between the <abbr> and <acronym> elements in HTML?

        • The <abbr> element is used to define an abbreviation or acronym, while the <acronym> element is obsolete and should not be used.

    84. What is the difference between the <pre> and <code> elements in HTML?

        • The <pre> element is used to preserve white space and line breaks in text, while the <code> element is used to display code snippets.

    85. What is the difference between the <ol> and <ul> elements in HTML?

        • The <ol> element is used for ordered lists, while the <ul> element is used for unordered lists.

    86. What is the difference between the <li> and <dt> elements in HTML?

        • The <li> element is used for list items, while the <dt> element is used to define a term in a description list.

    87. What is the difference between the <table> and <div> elements in HTML?

        • The <table> element is used to display tabular data, while the <div> element is a generic container for grouping content.

    88. What is the difference between the cellpadding and cellspacing attributes in HTML?

        • The cellpadding attribute specifies the amount of space between the border and the content of a cell, while the cellspacing attribute specifies the amount of space between cells.

    89. What is the difference between the colspan and rowspan attributes in HTML?

        • The colspan attribute specifies the number of columns a cell should span, while the rowspan attribute specifies the number of rows a cell should span.

    90. What is the difference between the <form> and <fieldset> elements in HTML?

        • The <form> element is used to create a form on a web page, while the <fieldset> element is used to group related form elements together.

    91. What is the difference between the <label> and <legend> elements in HTML?

        • The <label> element is used to associate a label with a form element, while the <legend> element is used to provide a caption for a fieldset.

    92. What is the difference between the autofocus and required attributes in HTML?

        • The autofocus attribute is used to automatically focus on a form element when the page loads, while the required attribute is used to require a user to input data into a form element before submitting the form.

    93. What is the difference between the <button>, <input type="button">, and <input type="submit"> elements in HTML?

        • The <button> element is used to create a clickable button on a web page, while the <input type="button"> and <input type="submit"> elements are input elements that can also create clickable buttons.

    94. What is the difference between the <textarea> and <input type="text"> elements in HTML?

        • The <textarea> element is used for multi-line text input, while the <input type="text"> element is used for single-line text input.

    95. What is the difference between the <progress> and <meter> elements in HTML?

        • The <progress> element is used to show the progress of a task, while the <meter> element is used to display a value within a range.

    96. What is the difference between the <figure> and <figcaption> elements in HTML?

        • The <figure> element is used to group together a media element and its caption, while the <figcaption> element is used to provide a caption for a <figure> element.

    97. What is the difference between the <a> and <link> elements in HTML?

        • The <a> element is used to create a hyperlink to another web page or resource, while the <link> element is used to link to external stylesheets, among other things.

    98. What is the difference between the <nav> and <header> elements in HTML?

        • The <nav> element is used to define a navigation menu on a web page, while the <header> element is used to define the top part of a web page.

    99. What is the difference between the <section> and <article> elements in HTML?

        • The <section> element is used to group related content together, while the <article> element is used to define a self-contained piece of content.

    100. What is the difference between the <main> and <div> elements in HTML?

         • The <main> element is used to define the main content of a web page, while the <div> element is a generic container for grouping content.

    101. What is the difference between the <aside> and <footer> elements in HTML? - The <aside> element is used to define content that is related to the main content, but not part of it, while the <footer> element is used to define the bottom part

Last Updated Date: February 15, 2023

If you have any queries post it in Comments..

Want To Help your Friends?? Take 5 Seconds To Share This post with your Friends..!!