C777 - Web App, 3rd Attempt Quiz
At what width will the image display? <style> img { border-radius:1em; width:400px; display:block; } </style> <img src="photo.jpg" alt="sunset in NYC" style="width:300px"> A. 400px B. 300px C. 300pt D. 400pt
300px
How do we specify the current HTML specification used in our document? A. <HTML doctype="strict"> B. <!DOCTYPE html> C. <!DOCTYPE strict html> D. <HTML doctype="html">
<!DOCTYPE html>
Which code correctly sets the audio to play immediately when the page loads? A. <audio controls autoplay> B. <audio autoplay="on"> C. <audio autoplay="true"> D. <audio "controls" "autoplay">
<audio controls autoplay>
Which code correctly applies controls to the video? A. <video controls="image.png" poster> B. <video controls="true" poster="image.png"> C. <video controls="controls" poster="image.png"> D. <video controls="true" poster="true">
<video controls="controls" poster="image.png">
What needs to be added to bind the animation to the div element? div { width: 100px; height: 100px; background-color: red; animation-duration: 4s; } @keyframes animate{ from {background-color: red;} to {background-color: yellow;} } A. Assign "animation-name: animate;" to the div rule. B. Assign "animation-name: @keyframes;" to the div rule. C. Assign "animation-name: animate;" to the @keyframe rule. D. Assign "animation-name: div;" to the @keyframe rule.
Assign "animation-name: animate;" to the div rule.
What will the following code display if the user types nothing in the input? alert("Begin message " + prompt("Message to user", "enter text") + " End message."); A. Begin Message enter text End message B. Begin Message Message to user End Message C. Begin Messageenter textEnd message D. Begin MessageMessage to userEnd Message
Begin Message enter text End message
What does the background-clip property do? A. It allows background images to be resized. B. It allows background images to be cropped. C. It determines whether the background image is transparent. D. It determines whether the background extends into the border or not.
It determines whether the background extends into the border or not.
Which statement is true about the element1~element2 selector? A. Element1 and element2 cannot have the same parent. B. It selects each occurrence of element2 that is preceded by element1. C. It selects each occurrence of element2 that is preceded by and is a sibling to element1. D. Element2 must immediately precede element1.
It selects each occurrence of element2 that is preceded by and is a sibling to element1.
What is an open-source multimedia file format that can be used for audio and video web files? A. WebM B. Ogg C. MP3 D. WAV
Ogg
Which color does this box turn when a user hovers a mouse pointer over it? .box { width: 150px; height: 150px; background: orange; margin-top: 20px; -webkit-transition: background-color 4s ease-out; -moz-transition: background-color 4s ease-out; -o-transition: background-color 4s ease-out; transition: background-color 4s ease-out; } .box:hover { background-color: purple; cursor: pointer; } A. Orange with a duration of four seconds. B. Purple with a duration of four seconds. C. Purple, after a delay of four seconds. D. Orange, after a delay of four seconds.
Purple with a duration of four seconds.
Why is it important to adopt a single standard and apply it to your web page markup? A. When you validate your markup code, the validation program can easily identify the actual cause of any invalid code. B. When you validate your markup code, only invalid code will be marked as such. C. When you validate your markup code, the code will match the DTD that you specify. D. You can more easily structure your web page without the need of document structure tags.
When you validate your markup code, only invalid code will be marked as such.
Which structure element should contain indirectly related to the subject of the document? A. article B. main C. section D. aside
aside
Which property positions the background-image relative to an element's border, padding or content? A. background-clip B. background-size C. text-overflow D. background-size
background-size
What is the innermost box of the CSS box model? A. margin B. padding C. content D. border
content
Which rule correctly adjust the overflow for this element: <div class="ex1">Good afternoon.</div> A. div.ex1 { overflow: scroll; } B. div,ex1 { overflow: scroll; } C. div.ex1 { overflow; scroll: } D. div,ex1 { overflow; scroll: }
div.ex1 { overflow: scroll; }
What is the correct JavaScript syntax to change the content of the first paragraph? <p id="demo" >This is a demonstration.</p> <p>second paragraph</p> A. document.getElementById("demo").innerHTML = "Hello World!"; B. document.getElement("p").innerHTML = "Hello World!"; C. document.getElementByName("p").innerHTML = "Hello World!"; D. #demo.innerHTML = "Hello World!";
document.getElementById("demo").innerHTML = "Hello World!";
Which selector targets every instance of an HTML element whose specified attribute begins with the specified value? A. element[attribute$=value] B. element:last-of-type C. element[attribute^=value] D. element[attribute*=value]
element[attribute^=value]
A developer needs to keep an image in the same place when the page is scrolled. Which CSS positioning scheme should this developer use? A. static B. fixed C. relative D. absolute
fixed
How do you create a function in JavaScript? A. function:myFunction() B. function() var = myFunction C. function = myFunction() D. function myFunction()
function myFunction()
Which tag defines the important heading and displays it at the smallest size? A. h6 B. h8 c. h5 D. h1
h6
Which selector targets one unique HTML element with a specific attribute assigned? A. id selector B. element1~element2 C. tag selector D. element:disabled
id selector
Which HTML tag defines a thematic grouping of content, typically with a heading? A. footer B. head C. section D. main
section
What is .blue from the following CSS called? .blue{ color:navy; } A. rule B. selector C. value D. property
selector
What code needs to be added to the div#myDiv selector to skew the element twenty degrees to the left? div { width: 300px; height: 100px; background-color: yellow; border: 1px solid black; } div#myDiv { } A. transform: skewX(20deg); B. transform: skewY(20deg); C. skewX(20deg); D. skewY(20deg);
transform: skewX(20deg);
Which corner of the padding edge does this code set the background relative to? background-origin:padding-box; A. upper left B. lower right C. upper right D. lower left
upper left
What does the transition-duration property specify? A. Specifies the speed curve of the transition effect B. Specifies how many seconds or milliseconds for the transition effect to delay C. Specifies the name of the CSS property the transition effect is for D. Specifies how many seconds or milliseconds a transition effect takes to complete
Specifies how many seconds or milliseconds a transition effect takes to complete
What does the perspective-origin property specify? A. Defines whether or not an element should be visible when not facing the screen B. Specifies the perspective on how 3D elements are viewed C. Specify the bottom position of a 3D element. D. Allows you to change the position on transformed elements
Specify the bottom position of a 3D element.
JavaScript is a scripting language for adding dynamic interactivity to Web pages. You can use JavaScript to: A. interpret the script and return the appropriate responses on the server side only. B. interpret the script and return the appropriate responses on the client side or on the server side. C. position text and graphics on a Web page. D. interpret the script and return the appropriate responses on the client side only.
interpret the script and return the appropriate responses on the client side or on the server side.
What is the outermost box of the CSS box model? A. content B. border C. margin D. padding
margin
Which structure element is best used to include hypertext menus that access various pages of your site? A. div B. a C. section D. nav
nav
Which rule correctly changes the color of the first paragraph element? A. p.first-of-type { color: #ff0000; } B. p::first-of-type { color: #ff0000; } C. p:first-of-type { color: #ff0000; } D. first-of-type { color: #ff0000; }
p:first-of-type { color: #ff0000; }
A developer needs twenty pixels of space on the left side of content relative to the border. Which CSS property should this developer use? A. margin-left:20pt; B. margin-left:20px; C. padding-left:20pt; D. padding-left:20px;
padding-left:20px;
Which declaration applies 30px to the right side of an element? A. padding:30px 20px; B. padding: 20px 40px 50px 30px; C. padding: 20px 40px 30px 50px; D. padding: 20px 30px 40px 50px;
padding: 20px 30px 40px 50px;
What term is a characteristic of an object that describes the object's attributes? A. value B. method C. property D. class
property
A developer needs to move an image 50px below where it is currently displayed, regardless of what content may preceded it. Which CSS positioning scheme should this developer use? A. static B. fixed C. relative D. absolute
relative
How will the paragraph text be aligned on the page? <style> .blue {color:navy;} h1, #bio {text-align:center; align:center;} #bio{font-size:1.25em; text-align:right;} </style> <p id="bio" class="blue">Learning CSS is fun!</p> A. left aligned B. cannot be determined C. center aligned D. right aligned
right aligned
Which tag should you use to reference an external .js file in your HTML document when you want to add JavaScript from an external text file? A. head B. html C. script D. body
script
