Web Development and Design Foundations with HTML5 (9th Edition) (What's New in Computer Science)
9th Edition
ISBN: 9780134801148
Author: Terry Felke-Morris
Publisher: PEARSON
expand_more
expand_more
format_list_bulleted
Question
Chapter 4, Problem 7HOE
a)
Program Plan Intro
- Include the style tag using “<style>” for internal style.
- Include the “footer” element. Inside the element,
- Set the background color as light blue with “#ccccff” color code.
- Set the font as “Arial” using “font-family” property.
- Set the text color as “dark-blue” with “#000099” color code.
- Make the 10 pixels of padding using “padding” property.
- Make the dashed border in a dark-blue color with “border” property.
- Include the “footer” element. Inside the element,
b)
Program Plan Intro
Program Plan:
- Include the style tag using “<style>” for internal style.
- Set the id named “notice” with following style attributes.
- Set the “width” property as “80%”.
- Set the “margin-left” as “auto” and “margin-right” as “auto”
- Set the id named “notice” with following style attributes.
c)
Program Plan Intro
Program Plan:
- Include the style tag using “<style>” for internal style.
- Set the class named “headline” with following style attributes.
- Set the text color using “color” property with its code.
- Set the dotted line border with border color using color code.
- Set the class named “headline” with following style attributes.
d)
Program Plan Intro
Program Plan:
- Include the style tag using “<style>” for internal style.
- Set the heading tag “<h1>” with its properties.
- Set the text shadow with its pixels.
- Set the background color and set the transparency using the “opacity” property.
- Set the font using “font-family” property with its font size.
- Set the heading tag “<h1>” with its properties.
e)
Program Plan Intro
Program Plan:
- Include the style tag using “<style>” for internal style.
- Set the style for “feature” identifier is as follows:
- Set the background color as “white” and text color as “red” with its color code.
- Set the font size as “small” with its font family “Arial”.
- Set the width as “80%” and set the text shadow.
- Set the style for “feature” identifier is as follows:
Expert Solution & Answer
Want to see the full answer?
Check out a sample textbook solutionStudents have asked these similar questions
HereWrite the code necesary in javascript to create a webpage that contains a contact form like the one in the attatched picture.
To create and style this form, copy the following HTML and CSS code exactly as follows:
HTML:
<form><label for="myName">Name:</label><input type="text" name="myName" id="myName"><label for="myEmail">E-mail:</label><input type="text" name="myEmail" id="myEmail"›<label for="myComments">Comments:</label><textarea name="myComments" id="myComments" rows="2" cols="20"></textarea><input id="mySubmit" type="submit" value="Submit"›</form>
CSS:
form { background-color:#eaeaea;font-family: Arial, sans-serif;padding: lOpx; }label { float: left;width: 100px;clear: left;text-align: right;padding-right: lOpx;margin-top: lOpx; }input, textarea { margin-top: lOpx;display: block; }#mySubmit { margin-left: 110px; }.
---Write the code necesary in javascript to create a webpage that contains a contact form like the one in the attatched picture.
To create and style this form, copy the following HTML and CSS code exactly as follows:
HTML:
<form><label for="myName">Name:</label><input type="text" name="myName" id="myName"><label for="myEmail">E-mail:</label><input type="text" name="myEmail" id="myEmail"›<label for="myComments">Comments:</label><textarea name="myComments" id="myComments" rows="2" cols="20"></textarea><input id="mySubmit" type="submit" value="Submit"›</form>
CSS:
form { background-color:#eaeaea;font-family: Arial, sans-serif;padding: lOpx; }label { float: left;width: 100px;clear: left;text-align: right;padding-right: lOpx;margin-top: lOpx; }input, textarea { margin-top: lOpx;display: block; }#mySubmit { margin-left: 110px; }gg
HTML/CSS JAVASCRIPT please help me answer this question I will give you a good rating Thank you!
Given the following html dynamic application
What is the output when the button is clicked ?( describe the visual effect when the button is clicked)
Modify the output from the original web page, so that the html will
create and place a new red div as illustrated inside the existing grey div and then transfers the paragraph inner content
at run-time ( inside the javascript function ) from the paragraph inside the grey div into the red div as illustrated.
DO NOT DO this by placing the paragraph content inside the div within the static HTML page,
use the document object model to access elements from the paragraph
and transfer content into the div element as illustrated
<! DOCTYPE html>
<html>
<head>
<title> First Illustration</title>
<link rel="stylesheet" type="text/css" href="first_ill_RRR.css">
<script src="project_6p.js"…
Chapter 4 Solutions
Web Development and Design Foundations with HTML5 (9th Edition) (What's New in Computer Science)
Ch. 4.1 - Prob. 1CPCh. 4.1 - Prob. 2CPCh. 4.1 - Prob. 3CPCh. 4.5 - Prob. 1CPCh. 4.5 - Prob. 2CPCh. 4.5 - Prob. 3CPCh. 4.7 - Prob. 1CPCh. 4.7 - Prob. 2CPCh. 4.7 - Prob. 3CPCh. 4 - Prob. 1MC
Ch. 4 - Prob. 2MCCh. 4 - Prob. 3MCCh. 4 - Prob. 4MCCh. 4 - Prob. 5MCCh. 4 - Prob. 6MCCh. 4 - Prob. 7MCCh. 4 - Prob. 8MCCh. 4 - Prob. 9MCCh. 4 - Prob. 10MCCh. 4 - Prob. 11FIBCh. 4 - Prob. 12FIBCh. 4 - Prob. 13FIBCh. 4 - Prob. 14FIBCh. 4 - Prob. 15FIBCh. 4 - Prob. 1AYKCh. 4 - Prob. 2AYKCh. 4 - Prob. 3AYKCh. 4 - Prob. 1HOECh. 4 - Prob. 2HOECh. 4 - Prob. 3HOECh. 4 - Prob. 4HOECh. 4 - Prob. 5HOECh. 4 - Prob. 6HOECh. 4 - Prob. 7HOECh. 4 - Prob. 8HOECh. 4 - Prob. 9HOECh. 4 - Prob. 10HOECh. 4 - Prob. 1WRCh. 4 - Prob. 2WRCh. 4 - Prob. 1FWD
Knowledge Booster
Similar questions
- Create an HTML document containing an empty document division, plus a button below the division. Script the button to call a function named play() when it's clicked; link the JavaScript file into which you will write the play() function, to your document. In your JavaScript file create a constructor for an object type named RPGActor; write code in the constructor so that it builds an instance of RPGActor containing: A property life, which represents the amount of life the actor object has; a property hitpoints, which represents how much damage the actor does when it attacks; a property alive, which is always set to true when the object is created; a method named attack(enemy), which takes an RPGActor object as its argument. The attack() method must do the following: Generate a random number from 0 to 2, which is used to decide if the attack misses (is blocked); if the number is greater than zero then the attack succeeds. If the attack succeeds, the hit points of the attacking actor…arrow_forwardJavaScript Assignment For this assignment you are only to use external CSS and JavaScript. This assignment shouldhave no templates or frameworks. The Fruits to be used are Apple, Orange, Pear, and Pineapple. Write the code in a way that allows it to pull the images from a folder inside the main folder named “images." The file names are as follows Apple.png, Orange.png, Pear.png, and Pineapple.png. You are to create a child's game. The game will have a title in the head of the boilerplate withyour name. The name of the game will be Fruit Game which will need to be included in theheader of the browser using a h1 element. You will display an image of a fruit. Under the imagethere will be room for text for the name of the fruit but not displayed at the start. You will havefour buttons with names for the fruits available. When the button with the fruit name is clickedthe name of the fruit will appear under the image of the fruit. If the button and the name of thefruit is the same then you…arrow_forwardWrite the code necesary in javascript to create a webpage that contains a contact form like the one in the attatched picture. To create and style this form, copy the following HTML and CSS code exactly as follows: HTML: <form><label for="myName">Name:</label> <input type="text" name="myName" id="myName"> <label for="myEmail">E-mail:</label> <input type="text" name="myEmail" id="myEmail"› <label for="myComments">Comments:</label> <textarea name="myComments" id="myComments" rows="2" cols="20"></textarea> <input id="mySubmit" type="submit" value="Submit"› </form> CSS: form { background-color:#eaeaea; font-family: Arial, sans-serif; padding: lOpx; } label { float: left;width: 100px;clear: left; text-align: right; padding-right: lOpx;margin-top: lOpx; }input, textarea { margin-top: lOpx;display: block; }#mySubmit { margin-left: 110px; }arrow_forward
- Write a JavaScript code with the following three different conditions: • Create the HTML document containing an element with id="myImage" for any images you want. • Use the HTML DOM to get the element with id="myImage". • Write a JavaScript function to change the JavaScript src attribute of element from " pet.gif" to " cat.jpg" when clicking on a button. Note: Students can use any gif and jpg files according to their choice. Important notes: 1. You should have to copy and paste the script as your answer to this question. DON’T take a screenshot for your script. It must be an editable script. 2. Take a screenshot of your output web page and paste it as a part of your answer.arrow_forwardJavaScript all design notvsame as web page remember that. Allala Write the code necesary in javascript to create a webpage that contains a contact form like the one in the attatched picture. To create and style this form, copy the following HTML and CSS code exactly as follows: HTML: <form><label for="myName">Name:</label><input type="text" name="myName" id="myName"><label for="myEmail">E-mail:</label><input type="text" name="myEmail" id="myEmail"›<label for="myComments">Comments:</label><textarea name="myComments" id="myComments" rows="2" cols="20"></textarea><input id="mySubmit" type="submit" value="Submit"›</form> CSS: form { background-color:#eaeaea;font-family: Arial, sans-serif;padding: lOpx; }label { float: left;width: 100px;clear: left;text-align: right;padding-right: lOpx;margin-top: lOpx; }input, textarea { margin-top: lOpx;display: block; }#mySubmit { margin-left: 110px; }.arrow_forwardCreate an infinite animation of an element moving in a square pattern. Write a CSS rule that changes the color of all elements containing attribute class = "green-Move" to green and shifts them down 25 pixels and right 15 pixels. 3. When the user hovers over an image, the size of the image should increase by 20%. Create a transformation program that includes four images.arrow_forward
- Create a javafx code where role players might have different level of access. Such as Admin have access to 1,2,3,4,5 and Employee 1,2,3arrow_forwardIn JavaScript create a program with the following parameters: Create an HTML page leaving the space between the <body> and </body> tags open. In the Title type a descriptive name Between the <body> and </body> tags add the <script> and </script> tags. Create a variable named myheading and give it this value: This is My Web Page! Create a variable named linktag and give it this value: SMC website and with a link to this text. Create a variable named Introtext and give it this value: See below for odd numbers stars. Create a variable named begineffect and give it the value: <strong>. Create a variable named endeffect and give it the value </strong>. Create a variable named beginpara and give it the value <p>. Create a variable named endpara and give it the value </p>. Place all of the variable definitions into a single var statement so that you do not need to keep repeating the var keyword remember to end the last line…arrow_forwardWeb Development: You are required to create a simple six-page website using HTML5 and CSS3. This project should include Javascript or a JS Library/Framework. FrameworkUse a CSS framework such as Foundation, Bootstrap, Tailwind CSS, UiKit, Bulma etc. FontsYour fonts must be one of the following sets. Baloo with Montserrat Amaranth with Open Sans Palanquin with Roboto Sansita with Open Sans Playfair Display and Fauna One Type Scale Augmented Fourth Colour Scheme options Choose one of the following options https://coolors.co/palette/ff9f1c-ffbf69-ffffff-cbf3f0-2ec4b6 https://coolors.co/palette/555b6e-89b0ae-bee3db-faf9f9-ffd6ba https://coolors.co/palette/ff6700-ebebeb-c0c0c0-3a6ea5-004e98 https://coolors.co/palette/6b9080-a4c3b2-cce3de-eaf4f4-f6fff8 Digital Asset Must include at least two (2) video assets Must include at least six (6) image assets ( at least one must be *.webp. ) No less than three javascript elements such as on demand header, show hide div etc. Site…arrow_forward
- Javascript .1. create a new global object variable “signUp” to store the sign-up information. Add the following properties to the object: name, email, phone, address, city, state, zip, foodAllergies, frequency, size and initialize all to a blank stringarrow_forwardI'm trying to learn CSS and it isn't easy. Can someone help me with this problem? Modify or add one CSS rule for each requirement below to change the text color property as specified. By color name: change the text color for byname class elements from black to blue. By RGB values: change the text color for byrgb class elements from black (rgb(0, 0, 0)) to green by modifying the second number to be 255. By HSL values: change the text color for byhsl class elements from black (hsl(0, 0%, 0%)) to cyan by modifying the first number to be 200, the second number to 100%, and the third number to 50%. Code: <p class="byname">The text is blue</p> <p class="byrgb">The text is green</p> <p class="byhsl">The text is cyan</p>arrow_forwardObjective:To add scripting to the existing web page and work with JavaScript Es-6 features like class, object , getter methods and collection. Problem Description:As part of a simple billing application, you are provided with an html page to obtain inputs for item number, item name, price & quantity. Using the ES-6 collections, add every item object into a Set and iterate through it to find the total cost to be paid. On adding each item object into Set, it must also get added to the table as a new record. Refer to the screenshot. Following are the files that contain code snippets index.html HTML for webpage (complete implementation is given for you). You only have to run this. No change needs to be done in this file. script.js Add your code to this file for the functions given. Procedure to complete the exercise Class Properties Methods Item itemNumberitemNamepricequantity Include constructor with properties and getter methods for Item properties…arrow_forward
arrow_back_ios
SEE MORE QUESTIONS
arrow_forward_ios
Recommended textbooks for you
- Database System ConceptsComputer ScienceISBN:9780078022159Author:Abraham Silberschatz Professor, Henry F. Korth, S. SudarshanPublisher:McGraw-Hill EducationStarting Out with Python (4th Edition)Computer ScienceISBN:9780134444321Author:Tony GaddisPublisher:PEARSONDigital Fundamentals (11th Edition)Computer ScienceISBN:9780132737968Author:Thomas L. FloydPublisher:PEARSON
- C How to Program (8th Edition)Computer ScienceISBN:9780133976892Author:Paul J. Deitel, Harvey DeitelPublisher:PEARSONDatabase Systems: Design, Implementation, & Manag...Computer ScienceISBN:9781337627900Author:Carlos Coronel, Steven MorrisPublisher:Cengage LearningProgrammable Logic ControllersComputer ScienceISBN:9780073373843Author:Frank D. PetruzellaPublisher:McGraw-Hill Education
Database System Concepts
Computer Science
ISBN:9780078022159
Author:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan
Publisher:McGraw-Hill Education
Starting Out with Python (4th Edition)
Computer Science
ISBN:9780134444321
Author:Tony Gaddis
Publisher:PEARSON
Digital Fundamentals (11th Edition)
Computer Science
ISBN:9780132737968
Author:Thomas L. Floyd
Publisher:PEARSON
C How to Program (8th Edition)
Computer Science
ISBN:9780133976892
Author:Paul J. Deitel, Harvey Deitel
Publisher:PEARSON
Database Systems: Design, Implementation, & Manag...
Computer Science
ISBN:9781337627900
Author:Carlos Coronel, Steven Morris
Publisher:Cengage Learning
Programmable Logic Controllers
Computer Science
ISBN:9780073373843
Author:Frank D. Petruzella
Publisher:McGraw-Hill Education