This set of HTML Multiple Choice Questions & Answers (MCQs) focuses on “Styling HTML5 Layout with CSS”.
1. Which of the following works as a sidebar?
Explanation: <aside> defines content aside from the content like a sidebar, <footer> defines a footer for a document or a section, <details> defines additional details, <section> defines a section in a document.
2. Which of the following can’t be the value of float property?
Explanation: float property can have the property left, right, none, inherit. When set to inherit value the element inherits the float value of its parent, when set to none property the element does not float, it is the default value.
3. Which of the following can’t be the value of a clear property?
Explanation: clear property specifies what elements can float beside cleared element and on which side. It can hold the values none, left, right, both and inherit. The inherit property inherits the clear value of its parent when setting to both no floating elements allowed on either the left and right side.
4. Which of the following specifies what happens if content overflow an element’s box?
Explanation: overflow property specifies what happens if content overflows an element’s box, overflow-x specifies what to do with left/right edges of the content if it overflows the element’s content area, overflow-y specifies what to do with top/bottom edges of the content if it overflows the element’s content area.
5. Which of the following was not previous layout mode?
b) Flexbox layout
Explanation: Before Flexbox layout module there were four layout modes. Block, Inline, Table, Positioned. Block is for sections in a webpage, inline is for text, table is for two dimensional table data, positioned is for explicit position of an element.
6. Which property defines in which direction the container wants to stack flex items?
Explanation: flex-direction property defines in which direction the container wants to stack the flex items, the flex-flow property is shorthand property for setting both flex-direction and flex-wrap properties. For deciding whether the flexible items should wrap or not, flex-wrap property is used.
7. Which property is used to align flex items?
Explanation: justify-content property is used to align flex items, the align-items property is used to align flex items vertically, the align-content property is used to align flex lines, flex-grow specifies how much a flex item will grow relative to rest of flex items.
8. Which of the following specifies initial length of flex item?
Explanation: flex-basis property specifies the initial length of the flex item, flex-shrink property specifies how much a flex item will shrink relative to rest of flex items, the value must be a number and a default value is 1. The flexible-grow property is a relative comparison between the items. It decides how much item will grow relative to the rest of flexible items inside the same container.
9. Which of the following overrides container’s align-items property?
Explanation: align-self property is used on flex items, it overrides container’s align-items property, flex is shorthand property for flex-grow, flex-shrink, and flex-basis properties, the order specifies the order of flexible item relative to rest of the flex items inside the same container.
Sanfoundry Global Education & Learning Series – HTML.
To practice all areas of HTML, here is complete set of 1000+ Multiple Choice Questions and Answers.