Question 2You are creating a web page that will have an image on it:Each box is created by a div element. You need to create the style rule that will generate the yellow box. Which rule should you create?1 point.child { width: 80%; height: 80%; position: absolute; top: 30px; left: 50px; background-color: yellow; border- radius: 56px; }.child { width: 80%; height: 80%; position: absolute; top: 30px; left: 50px; background-color: yellow; border-top-left-radius: 56px; border-bottom-right-radius: 56px; }.child { width: 80%; height: 80%; position: absolute; top: 30px; left: 50px; background-color: yellow; border-bottom-left-radius: 56px; border-bottom-right-radius: 56px; }.child { width: 80%; height: 80%; position: absolute; top: 30px; left: 50px; background-color: yellow; border-top-left-radius: 56px; border-top-right-radius: 56px; }
Question
Question 2You are creating a web page that will have an image on it:Each box is created by a div element. You need to create the style rule that will generate the yellow box. Which rule should you create?1 point.child { width: 80%; height: 80%; position: absolute; top: 30px; left: 50px; background-color: yellow; border- radius: 56px; }.child { width: 80%; height: 80%; position: absolute; top: 30px; left: 50px; background-color: yellow; border-top-left-radius: 56px; border-bottom-right-radius: 56px; }.child { width: 80%; height: 80%; position: absolute; top: 30px; left: 50px; background-color: yellow; border-bottom-left-radius: 56px; border-bottom-right-radius: 56px; }.child { width: 80%; height: 80%; position: absolute; top: 30px; left: 50px; background-color: yellow; border-top-left-radius: 56px; border-top-right-radius: 56px; }
Solution
The correct rule to create the yellow box would be:
.child {
width: 80%;
height: 80%;
position: absolute;
top: 30px;
left: 50px;
background-color: yellow;
border-radius: 56px;
}
This rule sets the width and height of the box to 80% of its parent element, positions it absolutely at 30px from the top and 50px from the left of its parent element, sets the background color to yellow, and gives it a border radius of 56px, which will make the corners of the box rounded. The other rules are incorrect because they only apply the border radius to specific corners of the box, not all of them.
Similar Questions
Question 1You are creating a web page that will have a div element with a class attribute that has a value of “child.” The element is formatted to look like a box. When the mouse hovers over the object, it should double in size and move to the right and down. You have created the style rule for the object:Now you need to create the style rule that will move the box when the mouse hovers over it.What rule should you create?1 point.child:hover { transform: scale(2) translate(-30px,30px); }.child:hover { transform: scale(30px,30px) translate(2); }.child:hover { transform: scale(2) translate(30px,30px); }.child:hover { transform: scale(2) translate(30px,-30px); }
Question 1You are creating a that has two div elements that have formatting applied. In testing, the two elements box look like this:When the user hovers over the smaller rectangle, you would like it to look like this:The yellow box has been formatted with the following style rule:You have begun creating the style rule that will be used when the user hovers over the yellow rectangle:What should you type in the blank space? (Remember, properties, values and functions should be in lower case.)
1. Set the width of the <div> element to "200px". Add a 2px solid red border to the <div> element. Add 25 pixels space between the <div> element's border and its content. Add a 25 pixels space outside, to the left of the <div> element.<body> <h1 class="myheader">This is a heading</h1> <p>This is a paragraph</p> <p>This is a paragraph</p></body>2. Based on the code above. Position the <h1> element to always be 50px from the top, and 10px from the right, relative to the window/frame edges. 3. Based on the code above. Position the <h1> element 50px from the top, relative to its normal position. 4. Based on the code above. Position the <h1> element 50px from the top, relative to the HTML page.5. Based on the code above. Position the <h1> element 50px from the top, by referring to its class name.6. Build a basic horizontal navigation bar using an unordered list (<ul>) and list items (<li>). Style the list items to be displayed as inline-block elements, creating a simple navigation menu.7. Design a styled button using a regular anchor (<a>) element. Adjust the display property to make it a block-level element and apply CSS styles to make it visually appealing. Add hover effects and transitions for a polished look.8. Create an HTML document with a mix of inline (e.g., <span>) and block-level (e.g., <div>) elements. Apply CSS to adjust the display property of these elements to change their behavior. For instance, make a block-level element behave like an inline element, and vice versa.
Question 3You are creating the background for a web page. You want to use a gradient that will flow from the center outward. What type of gradient should you use?1 pointcentralburstlinearradial
A background image can be specified for almost any HTML element.*2 pointsTRUEFALSE
Upgrade your grade with Knowee
Get personalized homework help. Review tough concepts in more detail, or go deeper into your topic by exploring other relevant questions.