NEW
Font size
WorksheetsWeb Design Advanced HTML CSS
Total questions: 18
Worksheet time: 9mins
Which of the following is the proper way to apply the CSS code inside style.css to the home.html file?
Inside home.html:
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
Inside home.html:
<head>
<style href="style.css"></style>
</head>
Inside style.css:
<html href="home.html">
Inside style.css:
applyTo {
href: home.html;
}
Which of the following is the proper way to link to the about.html page from the index.html page?
<a href="about">About This Site</a>
<a href="/about.html">About This Site</a>
<a href="about.html">About This Site</a>
<a href="/about">About This Site</a>
What are IFrames?
Buttons that link to other websites
Videos uploaded to your website
The number of views your website has
HTML pages embedded inside of other HTML pages
True or False: It is possible to embed any website inside IFrames.
True
False
What is the function of the div tag?
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
All of the above
Which of the following correctly uses div to style multiple elements the same way?
<div class="intro">
<h2>Welcome</h2>
<p>Hi, welcome to my page.</p>
</div>
<div>
<h2 class="intro">Welcome</h2>
<p class="intro">Hi, welcome to my page.</p>
</div>
<div>
.intro{
font-size: 16px;
font-style: italic;
}
<h2>Welcome</h2>
<p>Hi, welcome to my page.</p>
</div>
<h2 div class="intro">Welcome</h2>
<p div class="intro">Hi, welcome to my page.</p>
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 group and style inline elements, while <div> creates a line break
<span> is used to style elements, while <div> is used to embed parts of other websites
Which of the following selects all p tags with the class alert and makes them red?
p.alert {
color: red;
}
p {
.alert {
color:red;
}
}
.alert p{
color: red;
}
p alert{
color: red;
}
How can I select all h1 tags that are immediate children of div tags?
div h1 {
...
}
div > h1 {
...
}
div {
h1 {
...
}
}
.h1 div {
...
}
What is the reasoning behind the Don’t Repeat Yourself principle?
It helps you stay under the HTML file character limit
Repeated code makes it harder to read and edit
HTML files with repeated code will take a very long time to load
It makes a more clean and organized website for the user
What are some ways to cut down on repetitive code in your website?
Group together multiple selectors with commas
Strategically plan ahead to make sure the site is coded concisely
Use a div to style multiple elements
All of the above
Which of the following will turn the h1 tag blue as the mouse hovers over it?
hover > h1 {
color: blue;
}
h1:hover {
color: blue;
}
h1; hover {
color: blue;
}
h1, hover {
color: blue;
}
Which of the following will insert an exclamation point after every h2 element?
h2:after {
content: “!”;
}
h2:after {
content: !;
}
h2::after {
content: “!”;
}
h2::after {
content: !;
}
True or False: If a selector’s display property is set to none, selected elements will still take up space on the page.
True
False
Which of the following is not a property that can hide the visibility of an element?
opacity
hidden
visibility
display
True or False: You will learn everything there is to know about HTML and CSS from CodeHS.
True
False
Who might need to look something up in HTML/CSS documentation?
A student learning about web development
A web developer using a new feature
A person building a personal website as a hobby
All of the above!
The Inspector would be a useful tool for which of the following tasks?
Starting to write the HTML and CSS based on a design
Testing what small CSS changes will do to the site presentation
Finalizing changes made to the styling of the website
All of the above
