Code HS Test Web Design (Picasso) units 3 - 5 quiz questions
The Cascade determines which CSS rules will be applied when multiple rules for an item are contradictory.
What is the function of the Cascade in CSS?
To define a section of an HTML page To group a block of elements together to format them with CSS To efficiently apply the same style to several different elements
What is the function of the div tag?
Repeated code makes it harder to read and edit
What is the reasoning behind the Don't Repeat Yourself principle?
<input> in the search bar
What kind of element has the ID search_form_input_homepage ?
#logo { font-size: 60px; }
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?
img.inverted { filter: invert(100%); }
Which of the following applies the invert filter to all images with the class "inverted"?
img { height: 200px; }
Which of the following code snippets will select all <img> tags on a page and give them a height of 200 pixels?
.alert { color: red; }
Which of the following code snippets will select all HTML elements with the class "alert" and set their color to be red?
<div class="intro"> <h2>Welcome</h2> <p>Hi, welcome to my page.</p> </div>
Which of the following correctly uses div to style multiple elements the same way?
h1 { color: blue; }
Which of the following is a valid CSS rule?
background
Which of the following is not a part of the box model?
hidden
Which of the following is not a property that can hide the visibility of an element?
div > a { ... }
Which of the following selects all a tags that are immediate children of div tags?
div .footer { ... }
Which of the following selects all elements with the class footer that are inside of divs?
p.alert { color: red; }
Which of the following selects all p tags with the class alert and makes them red?
I only
Which of the following statements are true about styling your web pages with CSS: I. Styling with CSS is more scalable than using style= on each HTML tag that you want to style II. You can create styles with CSS that are not possible using style= on an HTML tag
h2::after { content: "!"; }
Which of the following will insert an exclamation point after every h2 element?
p::first-letter { color: blue; }
Which of the following will turn the first letter of all p elements blue?
h1:hover { color: blue; }
Which of the following will turn the h1 tag blue as the mouse hovers over it?
Embedding a map from Google Maps in your website
Which of the following would you use an IFrame for?
A student learning about web development A web developer using a new feature A person building a personal website as a hobby
Who might need to look something up in HTML/CSS documentation?
HTML wasn't intended to be able to style web pages, CSS allows us to add style Separate the content of a web page from the design of a web page Easily modify the look and feel of a web site even at a large scale
Why do we use CSS?
Excessive code is harder to read and understand It is easier to make edits to websites when CSS rules are strategically grouped and organized It demonstrates good coding style
Why is it important to avoid repetitive code while creating a website?
No
Yes or No. It is possible to embed any website inside IFrames.
10px
For the given div, what is the size of the right padding? div { width: 10px; height: 10px; padding: 15px 10px 5px 20px;
mg { filter: grayscale(100%); }
iWhich of the following applies a grayscale filter to all images?
Which of the following applies an animation named grayscaleFilter over 10 seconds to every img tag?
img { animation: grayscaleFilter 10s; }
Which of the following defines an animation increase-font that increases the font size from 5px to 20px?
@keyframes increase-font { from {font-size: 5px;} to {font-size: 20px;} }
<head> <link rel="stylesheet" type="text/css" href="style.css"> </head>
Assume you have two files for your website, and these files exist in the same folder: about.html style.css Which of the following is the proper way to apply the CSS code inside style.css to the about.html file?
Inside home.html: <head> <link rel="stylesheet" type="text/css" href="style.css"> </head>
Assume you have two files for your website, and these files exist in the same folder: home.html style.css Which of the following is the proper way to apply the CSS code inside style.css to the home.html file?
div > h1 { ... }
How can I select all h1 tags that are immediate children of div tags?
Select by id name, select by class name, select by tag name
CSS rules have a selector that defines which HTML elements the rule applies to. We've learned about the following CSS Selectors: Select by tag name Select by class name Select by id name Which of the following ranks the selectors from highest precedence to lowest precedence?
Importance, Specificity, Order
In what order does the Cascade look at factors to determine which CSS rule to follow?
logo_homepage
Inspect the picture of the duck in the middle of the page. You should see that it is actually a link (<a>). What is this a tag's class?
<style>, <head>
The CSS code goes inside the __________ tag which goes in the _____________ element. The style is separate from the content of the page. Because it is metadata about the content, it belongs in the head.
True
True or False: An image can have more than one CSS filter.
false
True or False: In the case that two conflicting rules have the same order and specificity, the rule that is written first will be applied.
HTML pages embedded inside of other HTML pages
What are IFrames?
pg-index
What is the ID of the body tag?
There would no longer be a smooth transition for the image:hover rule.
img { width: 100px; height: 100px; transition: width 2s, height 2s; } img:hover { width: 200px; height: 200px; } What would be the resulting difference if the line transition: width 2s, height 2s; was removed from the first CSS rule?
<a href="about.html">About This Site</a>
Assume you have two files for your website, and these files exist in the same folder: index.html about.html Which of the following is the proper way to link to the about.html page from the index.html page?
Group together multiple selectors with commas Strategically plan ahead to make sure the site is coded concisely Use a div to style multiple elements
What are some ways to cut down on repetitive code in your website?
<span> is used to group and style inline elements, while <div> creates a line break
What is the difference between <span> and <div>?
Any browser on any device will be able to view your webpage, because all browsers and devices on the Internet agree to use the same protocols for sending, receiving, and viewing webpages.
Suppose you have written a web page using HTML and CSS and it is hosted at the URL yourdomain.com/home.html Which of the following statements is true about which devices can view your website?
Testing what small CSS changes will do to the site presentation
The Inspector would be a useful tool for which of the following tasks?
<div>
You are trying to apply the same style to several different elements in a block, with line breaks before and after. Which tag should you use?
