CSS Questions and Answers
1. Way to interlink css
Answer: CSS can be linked in three ways:
- External CSS: Using the <link> tag in the HTML file to link to an external stylesheet.
- Internal CSS: Using the <style> tag within the <head> of the HTML document.
- Inline CSS: Adding the style attribute directly within an HTML element.
2. Important keyword
Answer: The !important keyword in CSS gives a style declaration higher priority, overriding other
rules unless they also have !important.
3. Selector
Answer: A CSS selector is a pattern used to select elements for styling. For example, .class, #id,
element, and attribute selectors.
4. Pseudo class and pseudo element
Answer: Pseudo-class: Used to define the special state of an element, e.g., :hover, :nth-child().
Pseudo-element: Used to style specific parts of an element, e.g., ::before, ::after.
5. List of background properties
Answer: - background-image: Set a background image.
- background-color: Set a background color.
- background-repeat: Repeat or not repeat the image.
- background-position: Set the starting position of the image.
- background-size: Set the size of the background image.
6. When to use min-width property
Answer: The min-width property is used when you want to ensure that an element cannot be resized
smaller than a specified minimum width.
7. Convert inline to inline-block and block to inline-block
Answer: - Inline to inline-block: Set the CSS property display: inline-block.
- Block to inline-block: Also set display: inline-block.
8. Font property
Answer: The font property in CSS is shorthand for setting font-style, font-variant, font-weight,
font-size, line-height, and font-family.
9. List of display properties
Answer: - block
- inline
- inline-block
- none
- flex
- grid
10. List of overflow values
Answer: - visible: Content is not clipped and may overflow the element.
- hidden: Overflow is clipped, and the rest of the content is not visible.
- scroll: Adds scrollbars if necessary.
- auto: Adds scrollbars only if content overflows.
11. Priority in interlinking css
Answer: Priority order (from lowest to highest):
- Browser default styles.
- External CSS.
- Internal CSS.
- Inline CSS (within elements).
- !important rules can override the normal priority.
12. How to make internal CSS
Answer: Internal CSS is written within a <style> tag inside the <head> section of the HTML file.
13. Difference between block and inline element
Answer: - Block elements: Take up the full width and start on a new line (e.g., <div>, <p>).
- Inline elements: Take only the necessary width and do not start on a new line (e.g., <span>, <a>).
14. Shorthand properties of font and background
Answer: - Font shorthand: font: font-style font-variant font-weight font-size/line-height font-family.
- Background shorthand: background: color image position/size repeat origin clip attachment.
15. Default value of position
Answer: The default value of the position property is static, meaning the element is positioned
according to the normal document flow.
16. What is position
Answer: The position property specifies the type of positioning method used for an element. Values
include static, relative, absolute, fixed, and sticky.