New Perspectives on HTML5, CSS3, and JavaScript
6th Edition
ISBN: 9781305503922
Author: Patrick M. Carey
Publisher: Cengage Learning
expand_more
expand_more
format_list_bulleted
Question
Chapter 3, Problem 20CP2
Program Plan Intro
To save the changes in ce_styles.css and verify that the layout of ce_front.html page resembles to the page given with case study.
Expert Solution & Answer
Want to see the full answer?
Check out a sample textbook solution
Students have asked these similar questions
Open 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…
In the contact.html file, remove the text, Phone Number:, from the first paragraph element within the main div element. Wrap the phone number within an anchor element that links to the phone number. Add a class attribute with the value tel-link to the parent paragraph element that contains the phone number link.
Add a class attribute with the value email-link to the anchor element that links to the email address within the main element.
I need this assignment solved. Below I've attached the index.hmtl and styles.css
Chapter 3 Solutions
New Perspectives on HTML5, CSS3, and JavaScript
Ch. 3.1 - Prob. 1QCCh. 3.1 - Prob. 2QCCh. 3.1 - Prob. 3QCCh. 3.1 - Prob. 4QCCh. 3.1 - Prob. 5QCCh. 3.1 - Prob. 6QCCh. 3.1 - Prob. 7QCCh. 3.1 - Prob. 8QCCh. 3.1 - Prob. 9QCCh. 3.2 - Prob. 1QC
Ch. 3.2 - Prob. 2QCCh. 3.2 - Prob. 3QCCh. 3.2 - Prob. 4QCCh. 3.2 - Prob. 5QCCh. 3.2 - Prob. 6QCCh. 3.2 - Prob. 7QCCh. 3.2 - Prob. 8QCCh. 3.2 - Prob. 9QCCh. 3.3 - Prob. 1QCCh. 3.3 - Prob. 2QCCh. 3.3 - Prob. 3QCCh. 3.3 - Prob. 4QCCh. 3.3 - Prob. 5QCCh. 3.3 - Prob. 6QCCh. 3.3 - Prob. 7QCCh. 3 - Prob. 1RACh. 3 - Prob. 2RACh. 3 - Prob. 3RACh. 3 - Prob. 4RACh. 3 - Prob. 5RACh. 3 - Prob. 6RACh. 3 - Prob. 7RACh. 3 - Prob. 8RACh. 3 - Prob. 9RACh. 3 - Prob. 10RACh. 3 - Prob. 11RACh. 3 - Prob. 12RACh. 3 - Prob. 13RACh. 3 - Prob. 14RACh. 3 - Prob. 15RACh. 3 - Prob. 16RACh. 3 - Prob. 1CP1Ch. 3 - Prob. 2CP1Ch. 3 - Prob. 3CP1Ch. 3 - Prob. 4CP1Ch. 3 - Prob. 5CP1Ch. 3 - Prob. 6CP1Ch. 3 - Prob. 7CP1Ch. 3 - Prob. 8CP1Ch. 3 - Prob. 9CP1Ch. 3 - Prob. 10CP1Ch. 3 - Prob. 11CP1Ch. 3 - Prob. 12CP1Ch. 3 - Prob. 13CP1Ch. 3 - Prob. 14CP1Ch. 3 - Prob. 15CP1Ch. 3 - Prob. 16CP1Ch. 3 - Prob. 17CP1Ch. 3 - Prob. 18CP1Ch. 3 - Prob. 19CP1Ch. 3 - Prob. 20CP1Ch. 3 - Prob. 1CP2Ch. 3 - Prob. 2CP2Ch. 3 - Prob. 3CP2Ch. 3 - Prob. 4CP2Ch. 3 - Prob. 5CP2Ch. 3 - Prob. 6CP2Ch. 3 - Prob. 7CP2Ch. 3 - Prob. 8CP2Ch. 3 - Prob. 9CP2Ch. 3 - Prob. 10CP2Ch. 3 - Prob. 11CP2Ch. 3 - Prob. 12CP2Ch. 3 - Prob. 13CP2Ch. 3 - Prob. 14CP2Ch. 3 - Prob. 15CP2Ch. 3 - Prob. 16CP2Ch. 3 - Prob. 17CP2Ch. 3 - Prob. 18CP2Ch. 3 - Prob. 19CP2Ch. 3 - Prob. 20CP2Ch. 3 - Prob. 1CP3Ch. 3 - Prob. 2CP3Ch. 3 - Prob. 3CP3Ch. 3 - Prob. 4CP3Ch. 3 - Prob. 5CP3Ch. 3 - Prob. 6CP3Ch. 3 - Prob. 7CP3Ch. 3 - Prob. 8CP3Ch. 3 - Prob. 9CP3Ch. 3 - Prob. 10CP3Ch. 3 - Prob. 11CP3Ch. 3 - Prob. 12CP3Ch. 3 - Prob. 13CP3Ch. 3 - Prob. 14CP3Ch. 3 - Prob. 1CP4Ch. 3 - Prob. 2CP4Ch. 3 - Prob. 3CP4Ch. 3 - Prob. 4CP4Ch. 3 - Prob. 5CP4Ch. 3 - Prob. 6CP4
Knowledge Booster
Similar questions
- Open the index.html file and update the comment with your name (firstname lastname), the file name, and the current date (MM/DD/YYYY). Add the text, CH 2 Extend Your Knowledge, to the title element. Locate all div elements and change them to one of the 5 appropriate HTML semantic element. Update the paragraph element on Line 15 to use an h1 element. In the main content area, wrap all paragraph elements within one article element and change the first paragraph element to an h2. For each paragraph element within the article element, add a black small square (▪) to the beginning of each sentence. In the navigation section, add a nonbreaking space, then a black circle ● (●), and then another nonbreaking space after the word Perceivable. Do the same for Operable and Understandable. <!DOCTYPE html><!-- Student Name: File Name: Date:11/07/2021--><html lang="en"><head><title>CH 2 Extend Your Knowledge</title><meta…arrow_forwardGo to the cw_home.html and cw_styles.css files and enter your name and the date in the comment section of each file. In cw_styles.css file and at the top of the file, use the @import rule to import the contents of the cw_designs.css file, which contains several style rules that format the appearance of different page elements. Go to the cw_home.html file and within the document head, insert a meta element that sets the browser viewport for use with mobile devices. Also, create links to cw_reset.css and cw_styles.css style sheets. Take some time to study the contents and structure of the document.arrow_forwardSetup Use your editor to open the ws_lincoln.html and ws_cloud.js. Enter your name and the date in the comment section of each file. Linking JS File Go to the ws_lincoln.html file in your editor. Link the page to the ws_cloud.css style sheet and the ws_stopwords.js and ws_cloud.js JavaScript files (in that order). Load the JavaScript files asynchronously. Study the contents of the file. Lincoln's speech is stored in a div element with the id "speech". The word cloud text will be placed in the aside element with the id "cloud". html---------------------------------------------------------------------- <!DOCTYPE html> <html lang="en"> <head> <!-- New Perspectives on HTML5, CSS3, and JavaScript 6th Edition Tutorial 13 Case Problem 4 Word Cloud of Lincoln's 1st Inaugural Author: Date: Filename: ws_lincoln.html --> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width,…arrow_forward
- 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.arrow_forwardOpen 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_forwardPlease don't copyarrow_forward
- in the index.html file, add a class attribute with the value tablet-desk to the second div element within the main element. Add a class attribute with the value corner to the image element. Remove the height and width attributes from the image element. <body> <div id="container"> <!-- Use the nav area to add hyperlinks to other pages within the website --> <nav> <ul> <li><a href="index.html">Home</a></li> <li><a href="#">Resources</a></li> <li><a href="#">W3C</a></li> </ul> </nav> <!-- Use the header area for the website name or logo --> <header> <h1>Responsive Design</h1> </header> <!-- Use the main area to add the main content of the webpage --> <main>…arrow_forwardTable Layout Open the mi_tables.css and go to the Table Styles section and add a style rule for the table element that: sets the background color to a linear gradient that goes to the bottom of the table background starting from rgb(190, 215, 255) and ending in black and adds a 5-pixels solid gray border. this is a programming question. The following is what I currently have (under table styles), but I am having a hard time getting more of the background columns to show. Thanks. /* Table Styles */ table { background: linear-gradient(to bottom , rgb(190, 215, 255), black); border: 5px solid gray; } th, td { border: 3px solid gray; line-height: 1.4em; padding: 8px; } th { background: black; color: rgb(130, 210, 255); font-weight: normal; } td { color: white; font-size: 0.9em; vertical-align: top; }arrow_forwardRevise the following img element to attach it to the mapsites image map: <img src=”logo.png” alt=”” />arrow_forward
arrow_back_ios
arrow_forward_ios
Recommended textbooks for you
New Perspectives on HTML5, CSS3, and JavaScriptComputer ScienceISBN:9781305503922Author:Patrick M. CareyPublisher:Cengage Learning
New Perspectives on HTML5, CSS3, and JavaScript
Computer Science
ISBN:9781305503922
Author:Patrick M. Carey
Publisher:Cengage Learning