CSS for Web Development

0% completed

Previous
Next
Quiz
Question 1
What is the default display behavior of a <div> element?
A
inline
B
block
C
inline-block
D
none
Question 2
What does position: static; do to an element?
A
Positions the element relative to its parent.
B
Positions the element fixed to the viewport.
C
Leaves the element in the normal document flow without special positioning.
D
Removes the element from the document flow.
Question 3
What is the role of z-index in CSS positioning?
A
It defines the horizontal position of an element.
B
It controls the stacking order of positioned elements.
C
It sets the size of an element.
D
It changes the display value of an element.
Question 4
What does position: relative; do to an element when additional offsets (top, left, etc.) are applied?
A
It positions the element relative to its original position without affecting the space it occupies.
B
It removes the element from the document flow entirely.
C
It fixes the element relative to the viewport.
D
It centers the element automatically.
Question 5
Consider the following HTML and CSS. Which element will appear on top based on their z-index values?
<style>
  .box1 {
    position: absolute;
    top: 50px;
    left: 50px;
    width: 150px;
    height: 150px;
    background-color: #ffcc80;
    z-index: 1;
  }
  .box2 {
    position: absolute;
    top: 100px;
    left: 100px;
    width: 150px;
    height: 150px;
    background-color: #90caf9;
    z-index: 3;
  }
</style>
<div class="box1"></div>
<div class="box2"></div>
A
.box1 appears on top because it is declared first.
B
Both boxes overlap equally with no clear front or back.
C
They appear side by side, not overlapping.
D
.box2 appears on top because its z-index is higher.

.....

.....

.....

Like the course? Get enrolled and start learning!
Previous
Next