# CSS interview question Q. What are the different ways to include CSS in a web page? 1- inline 2- internal 3- external 1- Inline CSS: Using the style attribute directly within an HTML element. <div style="color: red;">Hello World</div> 2- Internal CSS: Inside a <style> tag within the <head> section of an HTML document. <style> body { font-family: Arial, sans-serif; } </style> 3- External CSS: Linked to the HTML file via a <link> tag in the <head> section, referring to an external .css file. <link rel="stylesheet" href="styles.css"> Q. Explain the CSS box model. 1- Content: The actual content of the box (text, images, etc.). 2- Padding: Clears space around the content inside the element's border. It does not affect the layout but adds internal space. 3- Border: A border surrounding the padding (if any). It can have different widths, colors, and styles. 4- Margin: Clears space outside the border, providing space between elements. box-sizing: border-box box-sizing: content-box Q- 3. What is the difference between position: relative and position: absolute? .c{ background:blue; position: relative; height:100px} .relative { position: relative; top: 20px; left: 0px; background:red; } .absolute { position: absolute; top: 10px; left: 20px; background:green; } <div class="c"> <div class="relative">HTML</div> <div class="absolute">CSS</div> </div> Q - What is the difference between visibility: hidden and display: none?