{"id":5188,"date":"2026-02-19T09:15:53","date_gmt":"2026-02-19T09:15:53","guid":{"rendered":"https:\/\/murreeroad.org\/?p=5188"},"modified":"2026-02-19T09:17:29","modified_gmt":"2026-02-19T09:17:29","slug":"100-html-css-mcqs-with-answers-beginner-to-advanced","status":"publish","type":"post","link":"https:\/\/learn-nest.murreeroad.org\/blog\/100-html-css-mcqs-with-answers-beginner-to-advanced\/","title":{"rendered":"100 HTML & CSS MCQs with Answers (Beginner to Advanced)"},"content":{"rendered":"

Practice 100 HTML & CSS MCQs with answers covering basic to advanced concepts. Improve your web development skills with multiple choice questions on HTML tags, CSS properties, forms, layouts, animations, and responsive design.<\/p>\n

Are you preparing for a web development exam, job interview, or simply looking to strengthen your frontend skills? These 100 HTML & CSS MCQs with answers<\/strong><\/a> are designed to help you master both basic and advanced concepts of web design. From essential HTML tags and forms to modern CSS features like Flexbox, Grid, animations, and responsive design, this comprehensive multiple choice quiz will test your knowledge and improve your understanding. Whether you are a beginner or an aspiring professional developer, practicing these HTML and CSS multiple choice questions will boost your confidence and sharpen your coding skills.<\/p>\n

Here are 100 MCQs<\/a> on HTML & CSS<\/a><\/strong>. Each question has four options, and the correct answer is provided below each question.<\/p>\n

\n

HTML MCQs<\/strong><\/h3>\n

1. What does HTML stand for?<\/strong>
A) Hyper Text Markup Language
B) High Text Machine Language
C) Hyper Tool Multi Language
D) Hyperlinks and Text Markup Language
Answer: A<\/strong><\/p>\n

2. Who is the standard organization for HTML?<\/strong>
A) Google
B) Mozilla
C) W3C
D) Microsoft
Answer: C<\/strong><\/p>\n

3. The correct HTML element for the largest heading is:<\/strong>
A) <heading><\/code>
B) <h6><\/code>
C) <head><\/code>
D) <h1><\/code>
Answer: D<\/strong><\/p>\n

4. Which tag is used to create a paragraph in HTML?<\/strong>
A) <para><\/code>
B) <p><\/code>
C) <pg><\/code>
D) <paragraph><\/code>
Answer: B<\/strong><\/p>\n

5. Which attribute is used to provide a unique name to an HTML element?<\/strong>
A) class
B) id
C) name
D) type
Answer: B<\/strong><\/p>\n

6. Which HTML tag is used to insert an image?<\/strong>
A) <img><\/code>
B) <image><\/code>
C) <src><\/code>
D) <pic><\/code>
Answer: A<\/strong><\/p>\n

7. Which attribute specifies the URL of an image?<\/strong>
A) link
B) src
C) href
D) url
Answer: B<\/strong><\/p>\n

8. Which tag is used to create a hyperlink?<\/strong>
A) <a><\/code>
B) <link><\/code>
C) <href><\/code>
D) <hyper><\/code>
Answer: A<\/strong><\/p>\n

9. Which attribute is used with the <a><\/code> tag to specify the link address?<\/strong>
A) src
B) link
C) href
D) url
Answer: C<\/strong><\/p>\n

10. Which tag is used to create a line break?<\/strong>
A) <lb><\/code>
B) <br><\/code>
C) <break><\/code>
D) <newline><\/code>
Answer: B<\/strong><\/p>\n

\n

11. HTML files are saved with which extension?<\/strong>
A) .html
B) .ht
C) .hml
D) .xml
Answer: A<\/strong><\/p>\n

12. Which tag is used to define an unordered list?<\/strong>
A) <ol><\/code>
B) <ul><\/code>
C) <li><\/code>
D) <list><\/code>
Answer: B<\/strong><\/p>\n

13. Which tag is used for list items?<\/strong>
A) <li><\/code>
B) <item><\/code>
C) <ul><\/code>
D) <ol><\/code>
Answer: A<\/strong><\/p>\n

14. Which tag is used to create a table?<\/strong>
A) <table><\/code>
B) <tr><\/code>
C) <td><\/code>
D) <tab><\/code>
Answer: A<\/strong><\/p>\n

15. Which tag defines a table row?<\/strong>
A) <th><\/code>
B) <td><\/code>
C) <tr><\/code>
D) <row><\/code>
Answer: C<\/strong><\/p>\n

16. Which tag defines a table header cell?<\/strong>
A) <th><\/code>
B) <td><\/code>
C) <tr><\/code>
D) <thead><\/code>
Answer: A<\/strong><\/p>\n

17. Which tag is used to create a form?<\/strong>
A) <input><\/code>
B) <form><\/code>
C) <button><\/code>
D) <label><\/code>
Answer: B<\/strong><\/p>\n

18. Which input type is used for passwords?<\/strong>
A) text
B) password
C) hidden
D) secure
Answer: B<\/strong><\/p>\n

19. Which tag is used to define the document\u2019s body?<\/strong>
A) <main><\/code>
B) <body><\/code>
C) <section><\/code>
D) <content><\/code>
Answer: B<\/strong><\/p>\n

20. Which tag contains meta-information about the document?<\/strong>
A) <meta><\/code>
B) <head><\/code>
C) <info><\/code>
D) <title><\/code>
Answer: B<\/strong><\/p>\n

\n

CSS MCQs<\/strong><\/h3>\n

21. What does CSS stand for?<\/strong>
A) Computer Style Sheets
B) Cascading Style Sheets
C) Creative Style Sheets
D) Colorful Style Sheets
Answer: B<\/strong><\/p>\n

22. Which HTML tag is used to define internal CSS?<\/strong>
A) <css><\/code>
B) <script><\/code>
C) <style><\/code>
D) <link><\/code>
Answer: C<\/strong><\/p>\n

23. Which property is used to change text color?<\/strong>
A) font-color
B) text-color
C) color
D) background-color
Answer: C<\/strong><\/p>\n

24. Which property is used to change background color?<\/strong>
A) color
B) bg-color
C) background-color
D) back-color
Answer: C<\/strong><\/p>\n

25. Which CSS property controls text size?<\/strong>
A) font-style
B) text-size
C) font-size
D) text-style
Answer: C<\/strong><\/p>\n

\n

26. How do you select an element with id “demo”?<\/strong>
A) .demo
B) #demo
C) demo
D) *demo
Answer: B<\/strong><\/p>\n

27. How do you select elements with class “test”?<\/strong>
A) #test
B) .test
C) test
D) *test
Answer: B<\/strong><\/p>\n

28. Which property is used to change font?<\/strong>
A) font-family
B) font-style
C) text-font
D) typeface
Answer: A<\/strong><\/p>\n

29. Which property makes text bold?<\/strong>
A) font-weight
B) text-style
C) font-bold
D) bold
Answer: A<\/strong><\/p>\n

30. Which property aligns text horizontally?<\/strong>
A) text-align
B) align
C) horizontal-align
D) text-position
Answer: A<\/strong><\/p>\n

\n

(Continuing\u2026)<\/p>\n

31. Which property adds space inside an element?<\/strong>
A) margin
B) padding
C) spacing
D) border
Answer: B<\/strong><\/p>\n

32. Which property adds space outside an element?<\/strong>
A) margin
B) padding
C) border
D) spacing
Answer: A<\/strong><\/p>\n

33. Which property sets the border color?<\/strong>
A) border-style
B) border-width
C) border-color
D) border
Answer: C<\/strong><\/p>\n

34. Which CSS property controls the transparency?<\/strong>
A) opacity
B) visibility
C) transparent
D) alpha
Answer: A<\/strong><\/p>\n

35. Which property changes the list style type?<\/strong>
A) list
B) list-style-type
C) list-type
D) style-list
Answer: B<\/strong><\/p>\n

\n

36. Which position value makes an element relative to its normal position?<\/strong>
A) static
B) absolute
C) relative
D) fixed
Answer: C<\/strong><\/p>\n

37. Which position value fixes element to viewport?<\/strong>
A) static
B) fixed
C) relative
D) absolute
Answer: B<\/strong><\/p>\n

38. Which property is used for flexbox layout?<\/strong>
A) display: block
B) display: inline
C) display: flex
D) display: grid
Answer: C<\/strong><\/p>\n

39. Which property defines grid layout?<\/strong>
A) display: flex
B) display: block
C) display: inline
D) display: grid
Answer: D<\/strong><\/p>\n

40. Which property controls element visibility?<\/strong>
A) display
B) visible
C) show
D) opacity
Answer: A<\/strong><\/p>\n

\n

(Questions 41\u2013100 Continue Below)<\/h3>\n

41. Default position value in CSS?<\/strong>
A) relative
B) absolute
C) static
D) fixed
Answer: C<\/strong><\/p>\n

42. Which tag defines HTML5 semantic section?<\/strong>
A) <div><\/code>
B) <span><\/code>
C) <section><\/code>
D) <font><\/code>
Answer: C<\/strong><\/p>\n

43. Which tag is used for navigation links?<\/strong>
A) <navigate><\/code>
B) <nav><\/code>
C) <links><\/code>
D) <menu><\/code>
Answer: B<\/strong><\/p>\n

44. Which property rounds element corners?<\/strong>
A) border-style
B) corner-radius
C) border-radius
D) radius
Answer: C<\/strong><\/p>\n

45. Which property adds shadow to text?<\/strong>
A) text-shadow
B) font-shadow
C) shadow
D) box-shadow
Answer: A<\/strong><\/p>\n

\n

46. Which property adds shadow to box?<\/strong>
A) text-shadow
B) box-shadow
C) shadow-box
D) border-shadow
Answer: B<\/strong><\/p>\n

47. Which unit is relative to root element?<\/strong>
A) em
B) px
C) rem
D) %
Answer: C<\/strong><\/p>\n

48. Which tag defines footer?<\/strong>
A) <bottom><\/code>
B) <footer><\/code>
C) <end><\/code>
D) <section><\/code>
Answer: B<\/strong><\/p>\n

49. Which property changes cursor style?<\/strong>
A) mouse
B) pointer
C) cursor
D) hover
Answer: C<\/strong><\/p>\n

50. Which pseudo-class applies when hovering?<\/strong>
A) :hover
B) :click
C) :active
D) :focus
Answer: A<\/strong><\/p>\n

\n

\"100<\/a><\/p>\n

\n

51. Which tag embeds video?<\/strong>
A) <media><\/code>
B) <video><\/code>
C) <movie><\/code>
D) <mp4><\/code>
Answer: B<\/strong><\/p>\n

52. Which tag embeds audio?<\/strong>
A) <sound><\/code>
B) <audio><\/code>
C) <music><\/code>
D) <mp3><\/code>
Answer: B<\/strong><\/p>\n

53. Which attribute makes input required?<\/strong>
A) validate
B) required
C) must
D) necessary
Answer: B<\/strong><\/p>\n

54. Which property controls overflow?<\/strong>
A) overflow
B) flow
C) scroll
D) wrap
Answer: A<\/strong><\/p>\n

55. Which property prevents text wrapping?<\/strong>
A) text-wrap
B) nowrap
C) white-space
D) wrap-text
Answer: C<\/strong><\/p>\n

\n

56. Which value hides element but keeps space?<\/strong>
A) display: none
B) visibility: hidden
C) opacity: 0
D) hidden: true
Answer: B<\/strong><\/p>\n

57. Which value removes element completely?<\/strong>
A) visibility: hidden
B) display: none
C) opacity: 0
D) hidden: true
Answer: B<\/strong><\/p>\n

58. Which tag defines title?<\/strong>
A) <meta><\/code>
B) <title><\/code>
C) <head><\/code>
D) <header><\/code>
Answer: B<\/strong><\/p>\n

59. Which property sets element width?<\/strong>
A) size
B) length
C) width
D) max-width
Answer: C<\/strong><\/p>\n

60. Which property sets element height?<\/strong>
A) height
B) size
C) length
D) max-height
Answer: A<\/strong><\/p>\n

61. Which CSS property controls the stacking order of elements?<\/strong>
A) stack
B) z-index
C) order
D) layer
Answer: B<\/strong><\/p>\n

62. Which property is used to float an element?<\/strong>
A) align
B) float
C) position
D) display
Answer: B<\/strong><\/p>\n

63. Which property clears floated elements?<\/strong>
A) clear
B) float-clear
C) both
D) overflow
Answer: A<\/strong><\/p>\n

64. Which HTML element is inline by default?<\/strong>
A) <div><\/code>
B) <p><\/code>
C) <span><\/code>
D) <section><\/code>
Answer: C<\/strong><\/p>\n

65. Which HTML element is block-level by default?<\/strong>
A) <span><\/code>
B) <a><\/code>
C) <div><\/code>
D) <img><\/code>
Answer: C<\/strong><\/p>\n

\n

66. Which CSS property changes an element from block to inline?<\/strong>
A) position
B) display
C) float
D) align
Answer: B<\/strong><\/p>\n

67. Which value makes an element inline but allows width and height?<\/strong>
A) inline
B) block
C) inline-block
D) flex
Answer: C<\/strong><\/p>\n

68. Which property is used to create space between lines of text?<\/strong>
A) letter-spacing
B) word-spacing
C) line-height
D) text-spacing
Answer: C<\/strong><\/p>\n

69. Which property controls spacing between letters?<\/strong>
A) letter-spacing
B) word-spacing
C) line-height
D) text-indent
Answer: A<\/strong><\/p>\n

70. Which property controls spacing between words?<\/strong>
A) word-spacing
B) letter-spacing
C) text-spacing
D) spacing
Answer: A<\/strong><\/p>\n

\n

71. Which property indents the first line of text?<\/strong>
A) text-indent
B) indent
C) margin-left
D) padding-left
Answer: A<\/strong><\/p>\n

72. Which CSS rule is used for responsive design?<\/strong>
A) @responsive
B) @media
C) @screen
D) @device
Answer: B<\/strong><\/p>\n

73. Which property rotates an element?<\/strong>
A) transform
B) rotate
C) transition
D) animation
Answer: A<\/strong><\/p>\n

74. Which CSS function is used to scale an element?<\/strong>
A) resize()
B) zoom()
C) scale()
D) grow()
Answer: C<\/strong><\/p>\n

75. Which property defines the speed of a transition effect?<\/strong>
A) transition-speed
B) animation-speed
C) transition-duration
D) speed
Answer: C<\/strong><\/p>\n

\n

76. Which property specifies the name of an animation?<\/strong>
A) animation-name
B) animation-style
C) animation-type
D) keyframe
Answer: A<\/strong><\/p>\n

77. Which rule defines animation keyframes?<\/strong>
A) @animation
B) @transition
C) @keyframes
D) @frames
Answer: C<\/strong><\/p>\n

78. Which property makes text uppercase?<\/strong>
A) text-transform
B) font-transform
C) uppercase
D) text-style
Answer: A<\/strong><\/p>\n

79. Which property hides overflow content?<\/strong>
A) overflow: hidden
B) display: none
C) visibility: hidden
D) hidden: true
Answer: A<\/strong><\/p>\n

80. Which input type allows selecting multiple options?<\/strong>
A) radio
B) checkbox
C) text
D) password
Answer: B<\/strong><\/p>\n

\n

81. Which input type allows selecting only one option?<\/strong>
A) checkbox
B) radio
C) button
D) select
Answer: B<\/strong><\/p>\n

82. Which HTML tag defines a dropdown list?<\/strong>
A) <input><\/code>
B) <list><\/code>
C) <select><\/code>
D) <dropdown><\/code>
Answer: C<\/strong><\/p>\n

83. Which tag defines options inside a dropdown?<\/strong>
A) <choice><\/code>
B) <item><\/code>
C) <option><\/code>
D) <value><\/code>
Answer: C<\/strong><\/p>\n

84. Which attribute specifies placeholder text in input?<\/strong>
A) hint
B) text
C) placeholder
D) label
Answer: C<\/strong><\/p>\n

85. Which property sets maximum width?<\/strong>
A) max-width
B) maximum-width
C) width-max
D) limit-width
Answer: A<\/strong><\/p>\n

\n

86. Which property sets minimum height?<\/strong>
A) min-height
B) minimum-height
C) height-min
D) min-size
Answer: A<\/strong><\/p>\n

87. Which CSS property controls column layout?<\/strong>
A) column-count
B) columns-layout
C) grid-column
D) flex-column
Answer: A<\/strong><\/p>\n

88. Which property specifies font style (italic)?<\/strong>
A) font-weight
B) font-style
C) text-style
D) italic
Answer: B<\/strong><\/p>\n

89. Which property sets background image?<\/strong>
A) image
B) background-src
C) background-image
D) bg-image
Answer: C<\/strong><\/p>\n

90. Which property repeats background image?<\/strong>
A) background-repeat
B) image-repeat
C) repeat-image
D) bg-repeat
Answer: A<\/strong><\/p>\n

\n

91. Which property positions background image?<\/strong>
A) background-align
B) background-position
C) image-position
D) bg-location
Answer: B<\/strong><\/p>\n

92. Which value centers text?<\/strong>
A) left
B) right
C) justify
D) center
Answer: D<\/strong><\/p>\n

93. Which property changes mouse pointer to hand?<\/strong>
A) cursor: pointer
B) mouse: hand
C) pointer: true
D) hover: pointer
Answer: A<\/strong><\/p>\n

94. Which tag groups block-level elements?<\/strong>
A) <span><\/code>
B) <group><\/code>
C) <div><\/code>
D) <section><\/code>
Answer: C<\/strong><\/p>\n

95. Which HTML5 tag defines main content?<\/strong>
A) <main><\/code>
B) <content><\/code>
C) <primary><\/code>
D) <body><\/code>
Answer: A<\/strong><\/p>\n

\n

96. Which property makes element transparent?<\/strong>
A) visibility
B) opacity
C) transparent
D) display
Answer: B<\/strong><\/p>\n

97. Which property adds space between border and content?<\/strong>
A) margin
B) spacing
C) padding
D) border-space
Answer: C<\/strong><\/p>\n

98. Which CSS value makes element invisible but clickable?<\/strong>
A) opacity: 0
B) visibility: hidden
C) display: none
D) hidden: true
Answer: A<\/strong><\/p>\n

99. Which property defines the thickness of border?<\/strong>
A) border-style
B) border-width
C) border-size
D) border-thickness
Answer: B<\/strong><\/p>\n

100. Which CSS property sets the display type of an element?<\/strong>
A) position
B) float
C) display
D) visibility
Answer: C<\/strong><\/p>\n

Advertisement:<\/pre>\n
\"school-management-software\"<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
Practice 100 HTML & CSS MCQs with answers covering basic to advanced concepts. Improve your web development skills with multiple choice questions on HTML tags, CSS properties, forms, layouts, animations, and responsive design. Are you preparing for a web development exam, job interview, or simply looking to strengthen your frontend skills? These 100 HTML & … Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":5189,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"googlesitekit_rrm_CAowprK_DA:productID":"","om_disable_all_campaigns":false,"_uag_custom_page_level_css":"","_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[2106],"tags":[4009,4008,3998,3993,4001,3996,4003,4005,3999,4006,4011,3994,3997,3992,3995,4000,4002,4010,4004,4007,3980],"class_list":["post-5188","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-mcqs","tag-advanced-html-css-questions","tag-beginner-html-css-quiz","tag-css-interview-questions","tag-css-mcqs","tag-css-properties-questions","tag-css-quiz-with-answers","tag-css3-mcqs","tag-flexbox-mcqs","tag-frontend-development-mcqs","tag-grid-layout-mcqs","tag-html-css-mcqs","tag-html-and-css-multiple-choice-questions","tag-html-interview-questions","tag-html-mcqs","tag-html-quiz-with-answers","tag-html-tags-questions","tag-html5-mcqs","tag-programming-mcqs","tag-responsive-design-questions","tag-web-design-test-questions","tag-web-development-mcqs"],"aioseo_notices":[],"uagb_featured_image_src":{"full":["https:\/\/learn-nest.murreeroad.org\/blog\/wp-content\/uploads\/2026\/02\/100-HTML-CSS-MCQs-with-Answers-Beginner-to-Advanced.png",1536,1024,false],"thumbnail":["https:\/\/learn-nest.murreeroad.org\/blog\/wp-content\/uploads\/2026\/02\/100-HTML-CSS-MCQs-with-Answers-Beginner-to-Advanced-150x150.png",150,150,true],"medium":["https:\/\/learn-nest.murreeroad.org\/blog\/wp-content\/uploads\/2026\/02\/100-HTML-CSS-MCQs-with-Answers-Beginner-to-Advanced-300x200.png",300,200,true],"medium_large":["https:\/\/learn-nest.murreeroad.org\/blog\/wp-content\/uploads\/2026\/02\/100-HTML-CSS-MCQs-with-Answers-Beginner-to-Advanced-768x512.png",768,512,true],"large":["https:\/\/learn-nest.murreeroad.org\/blog\/wp-content\/uploads\/2026\/02\/100-HTML-CSS-MCQs-with-Answers-Beginner-to-Advanced-1024x683.png",1024,683,true],"1536x1536":["https:\/\/learn-nest.murreeroad.org\/blog\/wp-content\/uploads\/2026\/02\/100-HTML-CSS-MCQs-with-Answers-Beginner-to-Advanced.png",1536,1024,false],"2048x2048":["https:\/\/learn-nest.murreeroad.org\/blog\/wp-content\/uploads\/2026\/02\/100-HTML-CSS-MCQs-with-Answers-Beginner-to-Advanced.png",1536,1024,false]},"uagb_author_info":{"display_name":"admin","author_link":"https:\/\/learn-nest.murreeroad.org\/blog\/author\/admin\/"},"uagb_comment_info":0,"uagb_excerpt":"Practice 100 HTML & CSS MCQs with answers covering basic to advanced concepts. Improve your web development skills with multiple choice questions on HTML tags, CSS properties, forms, layouts, animations, and responsive design. Are you preparing for a web development exam, job interview, or simply looking to strengthen your frontend skills? These 100 HTML &…","_links":{"self":[{"href":"https:\/\/learn-nest.murreeroad.org\/blog\/wp-json\/wp\/v2\/posts\/5188","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/learn-nest.murreeroad.org\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/learn-nest.murreeroad.org\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/learn-nest.murreeroad.org\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/learn-nest.murreeroad.org\/blog\/wp-json\/wp\/v2\/comments?post=5188"}],"version-history":[{"count":2,"href":"https:\/\/learn-nest.murreeroad.org\/blog\/wp-json\/wp\/v2\/posts\/5188\/revisions"}],"predecessor-version":[{"id":5191,"href":"https:\/\/learn-nest.murreeroad.org\/blog\/wp-json\/wp\/v2\/posts\/5188\/revisions\/5191"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/learn-nest.murreeroad.org\/blog\/wp-json\/wp\/v2\/media\/5189"}],"wp:attachment":[{"href":"https:\/\/learn-nest.murreeroad.org\/blog\/wp-json\/wp\/v2\/media?parent=5188"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/learn-nest.murreeroad.org\/blog\/wp-json\/wp\/v2\/categories?post=5188"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/learn-nest.murreeroad.org\/blog\/wp-json\/wp\/v2\/tags?post=5188"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}