CTI-110: Lesson 8
What is the most specific selector in the code below? p { } #side-bar { } .main-content {} .main-content p {}
#side-bar
What is the correct syntax to select an element inside another element?
.main-list li {}
What is the correct syntax to style multiple unrelated selectors?
.nav-menu, p {}
How does this CSS rule set affect <h1> elements? h1 { letter-spacing: 20px; }
<h1> elements will have 20 pixels of space between every letter.
You wish to link a CSS file called main.css to an HTML file. Which of the following lines of code correctly links the HTML file and the stylesheet?
<link href="main.css" type="text/css" rel="stylesheet" />
Assuming the declarations inside are valid, what else is needed to complete a CSS rule set?
A valid selector and a set of curly braces ({}) surrounding the declarations.
How will the following CSS rule affect the text in <h1> elements? h1 { color: blue; }
Change the text color to blue.
The following CSS code fails to set the typeface of the heading to Courier New. Why? h1 { font-family: Courier New, Times, serif; }
Courier New must be enclosed in double quotation marks since it contains a space.
The font-weight property will adjust which of the following?
How thin or thick text appears.
Which of the following statements is correct?
IDs are more specific than classes and tags.
Why is it important to include web-safe, fallback fonts?
In the case that your custom fonts don't render, web-safe fonts provide a secondary option.
What is the main difference between inline styles and the <style> tag?
Inline styles directly modify individual HTML elements using a style attribute, whereas the <style> tag allows you to write CSS in a dedicated section of the HTML file.
What does the following line of HTML code do? <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
Links a font file and allows you to use the Lato font for font-family in CSS style rules.
What is one limitation of named CSS colors that hexadecimal and RGB colors do not have?
Named CSS colors are limited to a specific set and cannot represent the full color palette.
What does the fourth value inside rgba() control? body { background-color: rgba(212, 34, 99, 0.75); }
Opacity, or alpha value
Separating HTML and CSS into their own files helps accomplish which of the following?
Separating HTML structure from CSS style makes the code in both languages easier to read and maintain.
How would the following CSS rule set affect paragraph (<p>) elements? p { line-height: 1.5; }
Space will appear between lines of text in the <p> element because the container for each line is 1.5 times its default height.
What's the difference between serif and sans-serif fonts?
Specificity refers to how a browser decides which styles to display when there are multiple styles defined that could apply to the same element
Why might a user see the Times font with this CSS rule? h1 { font-family: Garamond, Times, serif; }
The Garamond font is not available on the user's computer, but Times is.
The following HTML code attempts to use inline styling to change the color of the paragraph text, but fails to do so. Why? <p color="red;">I am learning to code!</p>
The color attribute is invalid. It should be changed to style and then set equal to color: red;: <p style="color:red;">.
The following code attempts to style a paragraph using the <style> tag, but fails to do so. Why? <head> <style> <p style="color:red;">I'm learning to code!</p> </style> </head>
The contents of the <style> tag must be CSS code, not HTML code. The <p> will not appear at all.
The following CSS code attempts to set the color of a paragraph using an RGB color, but fails to do so. Why? p { color: rgb(277, 56, FF); }
The three parameters of the rgb() property must be numbers between 0 and 255.
What does the font-family property control?
The typeface used by the element.
What is the purpose of the HTML <link> tag when it comes to styling a page?
To link a specific stylesheet file to an HTML file so that the styles get applied on the page.
What does the <style> HTML tag allow?
Writing one or more CSS rules in CSS syntax inside an HTML file.
Which of the following will set an element's background to an image?
background-image: url("image.jpg");
How could this code be re-written but guarantee the same appearance in the browser? body h1 { color: #BB44FF; }
body h1 { color: #B4F; }
The following CSS code attempts to set the text color of a paragraph using a named color, but fails to do so. Why? p { color: bold; }
bold is not a valid color keyword in CSS.
Which of the following two CSS properties are used to set an HTML element's foreground color and background color, respectively?
color and background-color
Which of the following is a correct CSS declaration?
color: blue;
How would you make an <h1> element invisible on the page?
h1 { opacity: 0; }
Which rule will make all <h1> text uppercase?
h1 { text-transform: uppercase; }
What will be the color of the links after applying the CSS below? body { color: green;}.main-content a { color: blue;}a { color: red !important;}
red
The following HTML code links to what Google Font? <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
roboto