New Perspectives on HTML and CSS
6th Edition
ISBN: 9781111526443
Author: Carey, Patrick
Publisher: Course Technology Ptr
expand_more
expand_more
format_list_bulleted
Question
Chapter 4, Problem 22RA
Program Plan Intro
To apply the saturation filter with a value of 1.3 and include WebKit browser extension in FilterStyle section
Expert Solution & Answer
Trending nowThis is a popular solution!
Students have asked these similar questions
Help me complete this task.
Add the following style rules for the form elements.
Create a style rule for the fieldset and input elements that sets the bottom margin to 2%.
Create a style rule for the fieldset legend that sets the font-size to 1.25em and makes the font bold.
Create a style rule for the label that sets the display to block and sets padding-top to 3%.
Create a style rule for the btn class selector that removes the border, sets the top and bottom margin to zero and the left and right margin to auto, sets the display to a block, sets the padding to 5%, sets the background-color to 003399, sets the font-size to 1.25em, sets the border-radius to 10px, and sets the color to white (fff).
--my css
/* Style for body specifies a background color */
body {
background: linear-gradient(to top right, #fff 0%, #6699ff 100%) no-repeat fixed center;
font-family: Geneva, Arial, sans-serif;
}
/* Style for the container element */
#container {
width: 90%;
margin: 0 auto;
}…
CSS question
Add another div element to the web form containing the following code:
Insert an input element to create an option button for the orderType field with the ID delivery. Make the option button checked by default. After the option button, insert a label associated with the delivery control containing the text Delivery.
Add an input element to create a second option button for the orderType field with the ID pickup, followed by a label associated with the pickup control containing the text Pickup.
In the mobile style rules section, below the style rule for footer a, create a new style rule for images within the social class that sets the display to an inline block and sets the padding to 4%. Not right how I do it. see below:
Chapter 4 Solutions
New Perspectives on HTML and CSS
Ch. 4.1 - Prob. 1QCCh. 4.1 - Prob. 2QCCh. 4.1 - Prob. 3QCCh. 4.1 - Prob. 4QCCh. 4.1 - Prob. 5QCCh. 4.1 - Prob. 6QCCh. 4.1 - Prob. 7QCCh. 4.1 - Prob. 8QCCh. 4.1 - Prob. 9QCCh. 4.2 - Prob. 1QC
Ch. 4.2 - Prob. 2QCCh. 4.2 - Prob. 3QCCh. 4.2 - Prob. 4QCCh. 4.2 - Prob. 5QCCh. 4.2 - Prob. 6QCCh. 4.2 - Prob. 7QCCh. 4.2 - Prob. 8QCCh. 4.2 - Prob. 9QCCh. 4.3 - Prob. 1QCCh. 4.3 - Prob. 2QCCh. 4.3 - Prob. 3QCCh. 4.3 - Prob. 4QCCh. 4.3 - Prob. 5QCCh. 4.3 - Prob. 6QCCh. 4.3 - Prob. 7QCCh. 4.3 - Prob. 8QCCh. 4.3 - Prob. 9QCCh. 4 - Prob. 1RACh. 4 - Prob. 2RACh. 4 - Prob. 3RACh. 4 - Prob. 4RACh. 4 - Prob. 5RACh. 4 - Prob. 6RACh. 4 - Prob. 7RACh. 4 - Prob. 8RACh. 4 - Prob. 9RACh. 4 - Prob. 10RACh. 4 - Prob. 11RACh. 4 - Prob. 12RACh. 4 - Prob. 13RACh. 4 - Prob. 14RACh. 4 - Prob. 15RACh. 4 - Prob. 16RACh. 4 - Prob. 17RACh. 4 - Prob. 18RACh. 4 - Prob. 19RACh. 4 - Prob. 20RACh. 4 - Prob. 21RACh. 4 - Prob. 22RACh. 4 - Prob. 23RACh. 4 - Prob. 24RACh. 4 - Prob. 25RACh. 4 - Prob. 1CP1Ch. 4 - Prob. 2CP1Ch. 4 - Prob. 3CP1Ch. 4 - Prob. 4CP1Ch. 4 - Prob. 5CP1Ch. 4 - Prob. 6CP1Ch. 4 - Prob. 7CP1Ch. 4 - Prob. 8CP1Ch. 4 - Prob. 9CP1Ch. 4 - Prob. 10CP1Ch. 4 - Prob. 11CP1Ch. 4 - Prob. 1CP2Ch. 4 - Prob. 2CP2Ch. 4 - Prob. 3CP2Ch. 4 - Prob. 4CP2Ch. 4 - Prob. 5CP2Ch. 4 - Prob. 6CP2Ch. 4 - Prob. 7CP2Ch. 4 - Prob. 8CP2Ch. 4 - Prob. 9CP2Ch. 4 - Prob. 10CP2Ch. 4 - Prob. 11CP2Ch. 4 - Prob. 12CP2Ch. 4 - Prob. 1CP3Ch. 4 - Prob. 2CP3Ch. 4 - Prob. 3CP3Ch. 4 - Prob. 4CP3Ch. 4 - Prob. 5CP3Ch. 4 - Prob. 6CP3Ch. 4 - Prob. 7CP3Ch. 4 - Prob. 8CP3Ch. 4 - Prob. 9CP3Ch. 4 - Prob. 10CP3Ch. 4 - Prob. 11CP3Ch. 4 - Prob. 12CP3Ch. 4 - Prob. 13CP3Ch. 4 - Prob. 1CP4Ch. 4 - Prob. 2CP4Ch. 4 - Prob. 3CP4Ch. 4 - Prob. 4CP4Ch. 4 - Prob. 5CP4Ch. 4 - Prob. 6CP4
Knowledge Booster
Similar questions
- Draw a wireframe for the home page of your school's website. Write the CSS to configure a grid layout for the wireframe. Write the @media rule to target a typical smartphone device and configure the nav element selector with width set to auto.arrow_forwardOpen index.html in your browser to view the webpage. Maximize the browser window to use a desktop viewport. Below the gradient style rules comment, create a style rule for the gradient1 class selector and add the following declaration to specify a linear-gradient for the background: background: linear-gradient(to right, #67afcb, #1a3e4c 25%); Create a style rule for the gradient2 class selector and add a declaration to specify a linear-gradient to the left, use #d4f7ec and #448d76 for color values, and use 90% as the color stop. Create a style rule for the gradient3 class selector and add a declaration to specify a linear-gradient to the top left, and use #efddfd and #36065b for color values. Create a style rule for the gradient4 class selector and add a declaration to specify a linear-gradient that uses the following four color values: #e6e6ff #70dbdb #ffffcc #cc6699 Create a style rule for the gradient5 class selector and add the following declaration to…arrow_forwardAdd a blank line after the contact id style rule, add a comment with the text Style rules for footer content, and then create the following style rules for the footer and footer a selectors. Create a style rule for the footer selector that aligns text center, sets a font size value of 0.85em, sets a background color value of #2a1f14, sets a font color value of #f6eee4, and sets top and bottom padding values to 1% and right and left padding values to 0%. Create a style rule for footer a that sets the font color value to #f3e6d8 and removes the text decoration. I'm not sure what is wrong then my footer section. --- HTML <!-- Write your code here --> <!--Student Name: File Name: contact.html Date:10/04/2022 --> <!DOCTYPE html> <html lang="en"> <head> <title>Wild Rescues: Contact</title> <meta charset="utf-8"> <link rel="stylesheet" href="css/styles.css" /> <body> <header> <img…arrow_forward
- In the styles.css file, locate the “relative” comment and create a style rule for the relative class selector with the following declarations: Add a declaration for the position property with a value of relative. Add another declaration for the top property and specify a value of 90px. Add another declaration for the left property with a value of 30pxarrow_forwardGo to the Blockquote Styles section. Amy has included three sample reviews from users of the Save your Fork website. Amy wants the text of these reviews to appear within the image of a speech bubble. For every blockquote element, create a style rule that does the following: a) sets the background image to the sf_speech.png with no repeat and a horizontal and vertical size of 100% to cover the entire block quote (Hint: use property background-size: 100% 100%; ) b) uses the drop-shadow filter to add a drop shadow around the speech bubble with horizontal and vertical offsets of 5 pixels, a blur of 10 pixels and the color rgb(51, 51, 51) (Hint: use property filter: drop-shadow(5px 5px 10px rgb(51, 51, 51));)arrow_forwardCSS question Scroll down to the section element and, directly after the initial paragraph, insert a form element that employs the action at the fictional address http://www.example.com/redball/customer using the post method. Within the form element, insert a div element that encloses a label with the text Name* associated with the nameBox control. Also, within the divelement, add an input text box with the ID nameBox, field name custName, and placeholder text First and Last Name. Make custName a required field. (Hint: To make a field required, add the required attribute to the corresponding control element e.g. <input ... required>)arrow_forward
- Open index.html in your browser to view the file. Add the text, CH 5 Extend Your Knowledge, to the title element. Open the styles.css file and locate the "sticky” comment and create a style rule for the sticky class selector with the following rules: Add a declaration for the position property with a value of -webkit-sticky. Add a declaration for the position property with a value of sticky. Add a declaration for the top property and specify a 0 value. Refresh your page, and scroll down to view the changes. In the index.html file, use the empty paragraph element within the sticky div element to briefly explain how to use the sticky position. In the styles.css file, locate the “relative” comment and create a style rule for the relative class selector with the following declarations: Add a declaration for the position property with a value of relative. Add another declaration for the top property and specify a value of 90px. Add another declaration for the left property…arrow_forwardEdit the CSS file (leave a blank line between selectors): Add a BODY selector with a background color of #c2d4d4. Set an IMG selector with a max width of 98% and a top margin of 0.5em. Set a HEADER selector with a top margin of 0.2em and set the text to align to the center. Set a H1 selector with a bottom margin of 0.5em and set the font to sans-serif. Set a H2 selector with a bottom margin of 0.5em. Set a NAV selector with the font to sans-serif, a font size of 1.1em, set the font weight to bold, and set the text to align to the center. Set the NAV UL with padding of 0, top and bottom margins to 0.5em. Edit the NAV LI selector with a background color of #678197 and set the list items to display without bullets. Make a class called CENTER and set the bottom margin to 0.3em, the left and right margins to auto. Set a class called MOBILE with a display of inline. Set a class of DESKTOP with a display of none. Set a class of TABLET to display of none. Set a class called PHOTOS with a…arrow_forwardAdd a blank line after the main content style rules, add a comment with the text Style rules for class and id selectors and then create the style rules for the .link, .action, and #contact selectors: Create a style rule for the class selector link that sets the font color to #4d3319, removes the text decoration, sets the font weight value to bold, and sets the font style value to italic. Create a style rule for the class selector action that sets the font size to 1.75em, sets the font weight value to bold, and aligns text center. Create a style rule for the id selector contact that aligns text center. In the about.html file, within the #info div element, complete the following: Add a class attribute with the value of link to the anchor element with the text "National Wildlife Rehabilitators Association.". Remove the height and width attributes from the tortoise image (img) element. Add a class attribute with the value of action to the paragraph element where the text is "Did you…arrow_forward
- 4. Code a style rule for the main element that puts padding around its contents. Then, code a style rule for the footer that puts a blue border above it. Note that this border doesn’t touch the border for the body. 5. Code style rules for the h1, h2, and h3 elements. The h1 font should be 150% of the default specified in the body, the h2 font should be 125% of the default font, and the h3 font should be 115% of the default font. The h1 font should also be blue. Then, apply appropriate margins or padding to the h1, h2, and h3 elements so the spacing before and after the headings is similar to what’s shown above.6. Code the style rules for the <p>, blockquote, ul, and li elements so the spacing before and after the elements is similar to what’s shown above.7. Code a style rule for the cite element that changes its color to blue and removes the italics from the text.8. Code a style rule for the paragraphs that contain cite elements. This style rule should right align the paragraphs…arrow_forwardAdd the following comments to the tablet media query: Tablet Viewport: Show tab-desk class, hide mobile class Tablet Viewport: Style rules for nav area Add the following style rules below the "Show tab-desk class, hide mobile class" comment: Style rule for the tab-desk class selector that sets the display to a block. Style rule for the mobile class selector that sets the display to none.arrow_forwardAdd a blank line after the header h1 style rule, add a comment with the text Style rules for navigation area, and then create the following style rules for the nav, nav ul, nav li, and nav li a selectors. Create a style rule for the nav selector that sets the background color to #1d396d. Create a style rule for nav ul that sets the list style type to none, sets the margin to 0, and aligns text center. Create a style rule for nav li that sets the display to an inline-block, sets a font size of 1.5em, sets a font family value of Verdana, Arial, sans-serif, and a font weight value of bold. Create a style rule for nav li a that sets the display to a block, sets a font color value of #e3eaf8, sets top and bottom padding values of 0.5em and left and right padding values of 2em, and removes the text decoration. 6 Add a blank line after the nav li a style rule, add a comment with the text Style rules for main content, and then create the following style rules for the main, main…arrow_forward
arrow_back_ios
SEE MORE QUESTIONS
arrow_forward_ios
Recommended textbooks for you
New Perspectives on HTML5, CSS3, and JavaScriptComputer ScienceISBN:9781305503922Author:Patrick M. CareyPublisher:Cengage Learning
Np Ms Office 365/Excel 2016 I NtermedComputer ScienceISBN:9781337508841Author:CareyPublisher:Cengage
New Perspectives on HTML5, CSS3, and JavaScript
Computer Science
ISBN:9781305503922
Author:Patrick M. Carey
Publisher:Cengage Learning
Np Ms Office 365/Excel 2016 I Ntermed
Computer Science
ISBN:9781337508841
Author:Carey
Publisher:Cengage