0% found this document useful (0 votes)
22 views5 pages

HTML Css Questions

Html css question
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
22 views5 pages

HTML Css Questions

Html css question
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

HTML / CSS Questions with Solution

HTML Questions

1. What is HTML?

o Answer: HTML (HyperText Markup Language) is the standard markup language used
to create the structure of web pages.

2. What are tags in HTML?

o Answer: Tags are building blocks of HTML that define elements on a webpage, e.g.,
<p>, <div>, <h1>.

3. What is the difference between <div> and <span>?

o Answer: <div> is a block-level element used for layout and grouping content, while
<span> is an inline element used for styling or grouping inline content.

4. What is the purpose of the <head> tag?

o Answer: The <head> tag contains metadata, links to stylesheets, and scripts that do
not display directly on the webpage.

5. What is the difference between <section> and <article>?

o Answer: <section> groups related content, while <article> represents standalone


content, like a blog post.

6. What is semantic HTML?

o Answer: Semantic HTML uses meaningful tags like <header>, <footer>, <article> to
improve accessibility and SEO.

7. What is the use of the <iframe> tag?

o Answer: <iframe> embeds another HTML document within the current document.

8. How do you create a hyperlink in HTML?

o Answer: Use the <a> tag: <a href="url">Link Text</a>.

9. What is the difference between <ol> and <ul>?

o Answer: <ol> creates an ordered list (numbered), while <ul> creates an unordered
list (bulleted).

10. What is the difference between an ID and a class in HTML?

o Answer: An ID is unique and used once (id="header"), while a class can be reused
(class="btn").

11. How can you include images in HTML?

o Answer: Using the <img> tag: <img src="image.jpg" alt="description">.

12. What is the purpose of the alt attribute in the <img> tag?

o Answer: It provides alternative text for an image if it cannot be displayed.

13. What are HTML attributes?


HTML / CSS Questions with Solution
o Answer: Attributes provide additional information about an element, e.g., href in <a
href="url">.

14. What is the difference between src and href?

o Answer: src is for embedding resources (e.g., images, scripts), while href is for linking
resources (e.g., CSS, links).

15. What is a void element in HTML?

o Answer: Void elements do not have closing tags, e.g., <img>, <br>.

16. How do you create a table in HTML?

o Answer: Use <table>, <tr> (rows), and <td> (columns).

17. What is the purpose of the <form> tag?

o Answer: It creates a form for user input, often used with <input> and <button> tags.

18. What is the use of the <meta> tag?

o Answer: It provides metadata like charset, viewport settings, and page description.

19. What is the difference between <input> and <textarea>?

o Answer: <input> is for single-line input, while <textarea> is for multi-line text input.

20. What is the use of the action and method attributes in a <form>?

o Answer: action specifies where to send the form data, and method specifies how to
send it (GET or POST).

CSS Questions

21. What is CSS?

o Answer: CSS (Cascading Style Sheets) is used to style HTML elements.

22. What are the different types of CSS?

o Answer: Inline, Internal, and External CSS.

23. What is the difference between relative, absolute, and fixed positioning in CSS?

o Answer:

▪ relative: Positioned relative to its normal position.

▪ absolute: Positioned relative to its nearest positioned ancestor.

▪ fixed: Positioned relative to the viewport.

24. What is the box model in CSS?

o Answer: It consists of four areas: content, padding, border, and margin.

25. What is the difference between id and class in CSS?


HTML / CSS Questions with Solution
o Answer: id uses # and is unique; class uses . and is reusable.

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

o Answer:

▪ em: Relative to the font-size of the parent.

▪ rem: Relative to the font-size of the root element.

27. What are pseudo-classes in CSS?

o Answer: Special states of elements, e.g., :hover, :focus.

28. What are pseudo-elements in CSS?

o Answer: Used to style specific parts of elements, e.g., ::before, ::after.

29. What is the difference between inline, block, and inline-block elements?

o Answer:

▪ inline: Does not start on a new line (e.g., <span>).

▪ block: Starts on a new line (e.g., <div>).

▪ inline-block: Behaves like inline but supports block-level styling.

30. What is the difference between position: static and position: relative?

o Answer: static is the default position; relative offsets relative to itself.

31. What is a CSS preprocessor?

o Answer: A tool (e.g., SASS, LESS) that adds advanced features like variables and
functions to CSS.

32. What are media queries in CSS?

o Answer: They enable responsive design by applying styles based on device screen
size.

33. What is the difference between visibility: hidden and display: none?

o Answer:

▪ visibility: hidden: Hides the element but retains its space.

▪ display: none: Hides the element and removes its space.

34. What is a CSS Grid?

o Answer: A layout system for creating complex designs using rows and columns.

35. What is Flexbox in CSS?

o Answer: A layout model for aligning items in one-dimensional space, either


horizontally or vertically.

36. What are the differences between max-width and min-width?


HTML / CSS Questions with Solution
o Answer: max-width defines the maximum width an element can have; min-width
defines the minimum.

37. What is the z-index in CSS?

o Answer: It specifies the stack order of elements; higher values are in front.

38. What is the difference between RGB and HEX color codes?

o Answer:

▪ RGB: Uses red, green, and blue values, e.g., rgb(255, 0, 0).

▪ HEX: Uses hexadecimal format, e.g., #FF0000.

39. What is the difference between padding and margin?

o Answer:

▪ padding: Space inside an element.

▪ margin: Space outside an element.

40. What are the differences between inline, internal, and external CSS?

o Answer:

▪ Inline: Within the element (style="...").

▪ Internal: Within a <style> block in <head>.

▪ External: In a separate .css file.

Practical & Advanced

41. How do you make a website responsive?

o Answer: Use media queries, flexible layouts (Flexbox/Grid), and relative units like %,
em, rem.

42. How do you center a div?

o Answer:

o div {

o display: flex;

o justify-content: center;

o align-items: center;

o }

43. What is the difference between relative and sticky positioning?

o Answer: sticky switches between relative and fixed based on the scroll position.

44. What is a pseudo-class example for links?


HTML / CSS Questions with Solution
o Answer:

o a:hover { color: red; }

45. What are CSS animations?

o Answer: They enable transitions between states using keyframes.

46. How do you apply a background image in CSS?

o Answer:

o body {

o background-image: url('image.jpg');

o }

47. What are keyframes in CSS

- Answer: They define animations at various points,

e.g.,: css @keyframes example { 0% { opacity: 0; } 100% { opacity: 1; } }

48. What is the difference between nth-child and nth-of-type?

o Answer:

▪ nth-child: Targets the nth child.

▪ nth-of-type: Targets the nth occurrence of a specific type.

49. What is the use of opacity in CSS?

o Answer: It sets the transparency level of an element (0 = fully transparent, 1 = fully


opaque).

50. What is the use of clip-path in CSS?

o Answer: It defines a clipping region to hide parts of an element.

You might also like