1. Which of the following property is used to draw a line around elements outside the borders?
a) line
b) padding
c) outline
d) border
Explanation: Outlines do not take up space, they are drawn above the content.
2. Choose the option that correctly specifies the output of the following CSS.
span {
border: 1px solid red;
outline: green dotted thick;
}
a) All span elements will have a red border and a green dotted outline
b) All span elements will have a green thick border and a red outline
c) All span elements will have an outer red border and inner green dotted border
d) All span elements will have a outer green dotted border and an inner red border
Explanation: The border property creates the inner border, while the outline sets the outer border.
3. Which of the following property specifies the color of an outline?
a) color-outline
b) outline-color
c) outline-style-color
d) none of the mentioned
Explanation: As the property name specifies, it sets the color of the outline to the provided value.
4. Identify the outline property that specifies the amount of area extended beyond the border box.
a) outset3d
b) inset
c) outset
d) inset3d
Explanation: It specifies a 3D outset border. The effect depends on the border-color value.
5. Which of the following value specifies a dashed outline?
a) dash
b) dashed
c) double-dash
d) all of the mentioned
Explanation: The property defines a dashed border.
6. Which of the following property specifies the look and design of an outline?
a) outline-font
b) outline-style
c) outline-format
d) none of the mentioned
Explanation: The outline-style CSS property is used to set the style of the outline of an element. An outline is a line that is drawn around elements, outside the border edge, to make the element stand out.
7. Which of the following values specifies a 3D grooved outline?
a) initial
b) ridge
c) groove
d) groove3d
Explanation: groove specifies a 3D grooved border. The effect depends on the border-color value.
8. Select the output of the following CSS.
div {
border-width:5px;
border-style:dotted solid double dashed;
}
a) Box having dotted top outline, solid right outline, double bottom outline and dashed left outline
b) Box having dotted top outline, solid left outline, double bottom outline and dashed right outline
c) Box having dotted bottom outline, solid right outline, double top outline and dashed left outline
d) Box having dotted bottom outline, solid left outline, double top outline and dashed left outline
Explanation: The shorthand run in clockwise direction.
9. Which of the following specifies the width of an outline?
a) outline-size
b) outline-width
c) outline-height
d) both outline-size and outline-width
Explanation: The outline-width CSS property is used to set the width of the outline of an element.
10. Which of the following value specifies a solid outline?
a) bold
b) rock
c) solid
d) dashed
Explanation: As the name suggests, a solid outline is created using this value.