WorksheetsWeb Design 1: Final Review
Total questions: 48
Worksheet time: 24mins
What type of styling is used in this image?
Inline
Embedded
External
Imported
What type of styling is used in this image?
Inline
Embedded
External
Imported
What type of styling is used in this image?
Inline
Embedded
External
Imported
What is circled in this picture?
Rule
Selector
Declaration
Property
Value
What is circled in this picture?
Rule
Selector
Declaration
Property
Value
What is circled in this picture?
Rule
Selector
Declaration
Property
Value
What is circled in this picture?
Rule
Selector
Declaration
Property
Value
This is a picture of a...
Rule
Selector
Declaration
Property
Value
What are two naming conventions for classes and ids?
Names should be short and concise.
Names should be specific and descriptive.
Names should contain special characters and spaces.
Names should use spaces between words.
Rules for creating class (and id) names:
Cannot have spaces
Cannot start with a number
Can start with a number
Can start with a space
How many classes can you have for each HTML element?
As many as you want
One (1)
Two (2)
Ten (10)
Where do we add the class information in the HTML tag?
We add the class information in the opening tag
We add it right before each opening tag
We add it in the closing tag
We add it right after each closing tag
What is a class in CSS?
Attribute to add hyperlinks
Attribute to add colors
Attribute to style a specific group of elements
Attribute to add borders
When we use the tag as a selector, it selects ______ elements with that tag.
HTML
CSS
Javascript
XML
For embedded styling, where do we add the <style> tags on our HTML page. Why do they go there?
We add them in the <head> tag. They go there because they are part of the metadata that affects the appearance of the page.
We add them in the <body> tag. They go there because they should be visible to users.
We add them inside every tag. They go there because they only affect that section.
We add them after the closing </head> tag. They go there because they load faster.
What are possible values for the color property? (multiple correct answers)
named colors
hexadecimal color values
RGB color values
color can't be added
What are 2 problems with using HTML to style pages?
HTML styling is not scalable
HTML styling takes up a lot of time
a HTML styling improves website speed
HTML styling automatically optimizes images
HTML styling is always responsive
What font color will this p element have after being styled by the given CSS?
red
green
blue
black
What font color will this p element have after being styled by the given CSS?
red
green
blue
black
What font color will this p element have after being styled by the given CSS?
red
green
blue
black
Which of the following statements are true about styling your web pages with CSS:
A. Styling with CSS is more scalable than using style= on each HTML tag that you want to style
B. You can change HTML tag style attributes with CSS files that are also possible using inline style= on an HTML tag
A only
B only
Both A and B
Neither A nor B
Which of the following ranks the selectors from highest precedence to lowest precedence?
Select by tag name, select by class name, select by id name
Select by id name, select by tag name, select by class name
Select by id name, select by class name, select by tag name
Select by class name, select by id name, select by tag name
In what order does the Cascade look at factors to determine which CSS rule to follow?
Order, Importance, Specificity
Importance, Order, Specificity
Specificity, Importance, Order
Importance, Specificity, Order
What is the function of the Cascade in CSS?
The Cascade is a set of guidelines to make your site look beautiful.
The Cascade helps you write styling for your websites quickly by providing easy templates to use.
The Cascade determines which CSS rules will be applied when multiple rules for an item are contradictory.
The Cascade will make sure there are no typos in your CSS rules.
Which of the following CSS rules will select the HTML element with the id logo and set the font size for that element to 60 pixels?
Which of the following code snippets will select all HTML elements with the class "alert" and set their color to be red?
Why do we use CSS?
HTML wasn’t intended to be able to style web pages, CSS allows us to add style.
It separates the content of a web page from the design of a web page.
To store data for the website
To structure the content of a webpage
Which of the following is a valid CSS rule?
Which of the following code snippets will select all <img> tags on a page and give them a height of 200 pixels?
Which of the following selects images as the mouse hovers over them and sets their size to 350px by 350px?
Which of the following is not a property that can hide the visibility of an element?
hidden
visibility
opacity
display
Which of the following defines an animation change-color that changes the font color from green to red?
Which of the following will result in a smooth transition from green to red as the mouse clicks on h1 tags?
Which of the following applies an animation named grayscaleFilter over 10 seconds to every img tag?
Which of the following defines an animation increase-font that increases the font size from 5px to 20px?
What is the difference between <span> and <div>?
<span> is better for styling text, while <div> is better for styling images
<span> is for styling multiple elements, while <div> is for styling single elements at a time
<span> is used to style elements, while <div> is used to embed parts of other websites
<span> is used to group and style inline elements, while <div> creates a line break
If a selector’s display property is set to none, what happens to the selected elements?
They remain visible but cannot be clicked
They are completely removed from the layout and do not take up space
They become transparent but still affect the layout
They are hidden but still take up space on the page
Which of the following will insert an exclamation point after every h2 element?
Which of the following will turn the h1 tag blue as the mouse hovers over it?
What would happen to the body as a result of this CSS rule?
Each element in the body would change to red and italic as the mouse moves over it.
The entire body would change to red and italic when the mouse moves over any part of it.
The body would always be red and italic.
Nothing. This is an invalid rule.
How can I select all h1 tags that are immediate children of div tags?
Which of the following selects all p tags with the class alert and makes them red?
Would this rule affect the second image in the snippet of code provided?
Yes
No
Maybe
No images would be affected
Would this rule affect the first image in the snippet of code provided?
Yes.
No.
Maybe.
No images would be affected.
Which statement is true about spans and divs?
Spans and divs will add line breaks before and after they are used.
Spans will add line breaks before and after they are used; divs will not add line breaks.
Neither spans and divs will add line breaks before and after they are used.
Spans will add line breaks before and after they are used; divs will not add line breaks.
______________ are commonly used to style sections of text.
spans
divs
headers
p tags
Why are <div> elements commonly used in HTML?
To provide semantic meaning to the content
To group and style content without adding semantic meaning
To improve search engine optimization
To make content accessible for screen readers
Why are semantic tags used in HTML?
To provide semantic meaning to the content
To group and style content without adding semantic meaning
To improve search engine optimization
To make content accessible for screen readers
