The questions in this second quiz on CSS 1/2 are on the topics covered in the CSS Intermediate section of the site. The table below lists the
lessons, a description of the lesson content and the the quiz question number range.
Lesson Summary
Click on a lesson in the table to go to that lesson for a refresher on the topics for that lesson.
| CSS Intermediate Lessons |
Description |
Question Range |
| Lesson 1 - Backgrounds | Using Backgrounds to bring colour to the canvas of our webpages with the background, background-attachment,
background-color, background-image, background-position
and background-repeat CSS properties. | 1 - 5 |
| Lesson 2 - Finishing The Box Model | Using the height, min-height, max-height,
width, min-width and max-width CSS dimension propertries of the CSS box model. | 6 - 9 |
| Lesson 3 - Advanced Tag Selectors | A look at advanced tag selectors and how we can use them to select elements. | 10 - 12 |
| Lesson 4 - Pseudo Selectors | A look at CSS Pseudo selectors and how we can use them to select our elements. | 13 - 15 |
| Lesson 5 - Style Inheritance | A look at Style Inheritance and the effect this has on our CSS usage. | 16 - 18 |
| Lesson 6 - Specifity (the cascade) | A look at Specifity (the cascade) and how and when it effects our styles. | 19 - 22 |
| Lesson 7 - Positioning and Floating | A look at the position, top, right,
bottom, left, clip and z-index
CSS positional properties and the float and clear CSS floating properties. | 23 - 26 |
| Lesson 8 - Display | A look at the cursor, display,
overflow and visibility CSS properties and their effect on HTML elements. | 27 - 29 |
| Lesson 9 - CSS Intermediate Summary | Summarizing the tutorials in this section. | |
CSS Intermediate Quiz
The quiz below tests your knowledge of the material learnt in the CSS Intermediate section of the site.
Question 1 : Which CSS property specifes whether the background image scrolls or is fixed?
- The 'background-attachment' CSS property specifes whether the background image scrolls or is fixed.
Question 2 : Is it a good practice to specify a background color as well when specifying a background image?
- It is a good practice tospecify a background color as well as a background image as this acts as a 'fallback' when an image isn't available.
Question 3 : We can use keywords, precise measurements and what else to fix a background images position?
- We can use keywords, precise measurements and percentages to fix a background images position.
Question 4 : Which CSS 'background-repeat' property value will repeat an image horizontally and vertically.?
- A declaration group must have at least one declaration and can have many more than 1.
Question 5 : We can set all other background properties using the CSS background shorthand property?
- yes we can set all other background properties using the CSS background shorthand property.
Question 6 : Why would you use the CSS 'overflow' property with the CSS 'height' property?
- You would you use the CSS 'overflow' property with the CSS 'height' property because a user can change their browser font size.
Question 7 : The min and max height/width properties allow us to set a finite size for?
- The min and max height/width properties allow us to set a finite size for our boxes or the whole viewable screen (via the body element).
Question 8 : The width and height CSS properties allow us to set the dimensions for a box element?
- The width and height CSS properties allow us to set the dimensions for the content part of a box element, not the entire box element which includes padding, border and margin as well.
Question 9 : What is the default property value of CSS 'line-height' property?
- The default property value of CSS 'line-height' property is <em>normal</em> which allows the browser to assign the 'line-height' property value based on the box font-size.
Question 10 : Which of the following is an example of a child selector?
- We use the <code>></code> symbol (greater than) for child selectors, so <code>div>p</code> is an example of a child selector.
Question 11 : Which of the following is an example of a descendant selector?
- Valid descendant selectors have a space between the ancestor and descendant, so <code>div p</code> is an example of a descendant selector.
Question 12 : Which of the following is an example of an adjacent sibling selector?
- We use the <code>+</code> symbol (plus) for adjacent sibling selectors, so <code>div+p</code> is an example of an adjacent sibling selector.
Question 13 : How many pseudo-class selectors are there available for our use in CSS 1/2?
- There are 7 pseudo-class selectors available for our use in CSS 1/2, these being <code>:first-child</code>, <code>:lang(language-code)</code>, <code>:active</code>, <code>:hover</code>, <code>:link</code>, <code>:visited</code> and <code>:focus</code>.
Question 14 : How many pseudo-element selectors are there available for our use in CSS 1/2?
- There are 4 pseudo-element selectors available for our use in CSS 1/2, these being <code>:first-letter</code>, <code>:first-line</code>, <code>:before</code>, and <code>:after</code>.
Question 15 : Which of the mouse pseudo-class selectors is the least useful for a user?
- The <code>:active</code> mouse pseudo-class selector determines how a link looks as a visitor clicks on it so for a user the use of this selector may not even be apparent.
Question 16 : Which HTML tag is at the top of the inheritance hierarchy?
- The body HTML tag is at the top of the inheritance hierarchy.
Question 17 : Style inheritance only applies to the direct descendants of a HTML tag?
- Style inheritance only applies to all all generations of a HTML tag.
Question 18 : All CSS properties are inheritable?
- Not all CSS properties are inheritable; as an example we wouldn't want all descendants to inherit the 'border' CSS property.
Question 19 : What specifity value does a tag selector have?
- A tag selector has a specifity value of 1.
Question 20 : What specifity value does an id selector have?
- An id selector has a specifity value of 100.
Question 21 : If you have a class selector, id selector and inline style being used to style an element which one will the browser use?
- The inline style will be used to style an element as it has a specifity of 1000 compared to the class and id selectors which have lower specifities.
Question 22 : What happens when two styles for a selector in a stylesheet have the same specifity?
- When two styles for a selector in a stylesheet have the same specifity the style that appears last in our stylesheets wins.
Question 23 : Which positional CSS property allows us to specify the displayable dimensions, of a visible, absolutely positioned element?
- The 'clip' positional CSS property allows us to specify the displayable dimensions, of a visible, absolutely positioned element.
Question 24 : What does the 'float' CSS property allow us to do?
- The spaces in the border are filled with the background colour.
Question 25 : The CSS 'z-index' property allows us to specify a stack order along the z-axis for?
- The CSS 'z-index' property allows us to specify a stack order along the z-axis for positioned elements.
Question 26 : What integer property values can we use with the 'z-index' CSS property?
- We can use negative and positive integers with the 'z-index' CSS property to sort the stack order of positioned elements.
Question 27 : Which CSS property specifies the type of box generated for an element?
- The 'display' CSS property specifies the type of box generated for an element.
Question 28 : Which CSS property specifies whether the type of box generated is rendered?
- The 'visibility' CSS property specifies whetherthe type of box generated is rendered.
Question 29 : What is the default property value of the 'overflow' CSS property?
- The default property value of the 'overflow' CSS property is <em>:visible</em> which means the content will not be clipped and will be visible outside the element's box.
Quiz Progress Bar Please select an answer
What's Next?
In the next quiz we test our knowledge of the topics covered in the CSS Advanced section of the site.
Homepage
Top
