1. Difference between <div> and<span> ?
<div>
=> <div> is a block-level element,it starts on a new line and takes up the full available width by default.
=><div>is primarily used for structuring and grouping larger sections of content, creating distinct blocks within a webpage layout.
=> <div> element inherently introduces a line break before and after it in the flow of the document.
=> <div> elements are commonly nested within each other to create complex page layouts and hierarchical structures.
<span>
=> <span>is an inline-level element,it does not start on a new line and only takes up the width necessary for its content.
=> <span> is used for styling or targeting smaller, inline portions of text or other inline elements within a larger block.
=> <span> element does not introduce line breaks and will appear on the same line as surrounding inline content.
=> <span>elements can be nested, it's typically for styling specific parts of inline text and not for defining overall structure.
2. Difference between class and id ?
class
=> class is used to group multiple elements that share common styling or behavior.
=> class is selected using a dot (.) followed by the class name (e.g., .highlight).
=> classes are used for reusable styles and behaviors that can be applied across various elements or components (e.g., button, card, active).
Id
=> id is used to uniquely identify a single, specific element for styling or scripting purposes.
=> An id is selected using the hash symbol (#) followed by the id name (e.g., #myHeader).
=> ids are typically reserved for major, unique structural elements or components within a page (e.g., header, footer, main-content).
3. Difference between block and inline elements ?
Block
=> Block elements always start on a new line and force subsequent elements to also start on a new line.
=> Block elements, by default, occupy the full available width of their parent container, irrespective of their content's actual width.
=> Block elements accept and render all four types of margins and padding (top, bottom, left, right).
Inline
=> Inline elements,do not start on a new line and allow other inline elements to appear on the same line.
=> Inline elements only occupy the width necessary to contain their content.
=> Inline elements only accept horizontal margins and padding (left and right); vertical margins and padding (top and bottom) are ignored, though vertical padding can visually affect the element's background.
4. What are void elements ?
Void elements are HTML elements that do not have a closing tag and cannot contain any content. They are self-closing and are used for things like line breaks, images, and metadata. Common examples include<br>, <img>,<hr>, and <input>.It consist of a single start tag.For example, <input> is used, not <input></input>.
5. What is the use of <a>tag ?
The <a>tag, or anchor tag, is used in HTML to define a hyperlink, which links one page to another.It uses the href attribute to specify the link destination. It can link to external websites, internal pages, or files.The <a> tag can also link to email addresses using mailto:. It is one of the most important tags for website navigation and user movement.
Top comments (0)