Web Development and Design Foundations with HTML5 (8th Edition)
8th Edition
ISBN: 9780134322759
Author: Terry Felke-Morris
Publisher: PEARSON
expand_more
expand_more
format_list_bulleted
Concept explainers
Expert Solution & Answer
Chapter 3, Problem 2AYK
Explanation of Solution
Program:
<!--HTML Tag-->
<html lang="en">
<!--Head Tag-->
<head>
<!--Title Tag-->
<title>Trillium Media Design</title>
<meta charset="utf-8">
<!--Style Tag-->
<style>
<!--Alignment for Body Tag-->
body
{
background-color: #0066CC;
color: #00CED1 ;
}
<!--Alignment for header Tag-->
header {
font-family: Arial, sans -serif }
<!--Close Tag-->
Expert Solution & Answer
Want to see the full answer?
Check out a sample textbook solution
Students have asked these similar questions
For this incorrect code dislike please attach code with proof.
Write a sample code for External CSS - The <link> Element
Write a JavaScript code with the following three different conditions:
Create the HTML document containing an <img> 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 <img> 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.
Chapter 3 Solutions
Web Development and Design Foundations with HTML5 (8th Edition)
Ch. 3.4 - Prob. 1CPCh. 3.4 - Prob. 2CPCh. 3.4 - Prob. 3CPCh. 3.8 - Prob. 1CPCh. 3.8 - Prob. 2CPCh. 3.8 - Prob. 3CPCh. 3 - Prob. 1MCCh. 3 - Prob. 2MCCh. 3 - Prob. 3MCCh. 3 - Prob. 4MC
Ch. 3 - Prob. 5MCCh. 3 - Prob. 6MCCh. 3 - Prob. 7MCCh. 3 - Prob. 8MCCh. 3 - Prob. 9MCCh. 3 - Prob. 10MCCh. 3 - Prob. 11MCCh. 3 - Prob. 12FIBCh. 3 - Prob. 13FIBCh. 3 - Prob. 14FIBCh. 3 - Prob. 15FIBCh. 3 - Prob. 1AYKCh. 3 - Prob. 2AYKCh. 3 - Prob. 3AYKCh. 3 - Prob. 1HOECh. 3 - Prob. 2HOECh. 3 - Prob. 3HOECh. 3 - Prob. 4HOECh. 3 - Prob. 5HOECh. 3 - Prob. 6HOECh. 3 - Prob. 7HOECh. 3 - Prob. 8HOECh. 3 - Prob. 9HOECh. 3 - Prob. 1WRCh. 3 - Prob. 2WRCh. 3 - Prob. 1FWD
Knowledge Booster
Learn more about
Need a deep-dive on the concept behind this application? Look no further. Learn more about this topic, computer-science and related others by exploring similar questions and additional content below.Similar questions
- Create a CSS file youName.css and link it to the HTML file you created earlier in Part 1. The results after filling the styles should be as shown in the image below. NOTE 1: Add classes and ids as you find suitable in the HTML file. NOTE 2: Any style that is not specified, may be specified as you wish (like margins, paddings …). NOTE 3: The width of the <body> is 700px and the font-family is “Arial”. after finsih it must be as the imagearrow_forwardDesign HTML Form in javascriptApply the data validation :1. Mobile number field data must be a numeric data and not less than 8 digits,2. The email field must accept the data which must contain the character '@' and dot (.). Andthe character @ must not be the first character and the last dot must at least be onecharacter after the @.On submitting the form, If all these validations are followed, another Html page.arrow_forwardI need help with this, please. Thanks Develop an Expand/Collapse application using JQUERYIn this exercise, you’ll develop an application that displays the first paragraph of text for three topics and then lets the user click a link to expand or collapse the text for each topic.2. Review the HTML. Note that each topic consists of two div elements followed by an <a> element. Also, note that a class named “hide” is assigned to the second div element of each topic. Then, review the style rule for this class.3. In the JavaScript file, add an event handler for the ready() event method.4. Within the ready() event method, code an event handler for the click() event method of the <a> elements. This event handler should start by preventing the default action of the link and storing the clicked link in a constant. Then, it should use the toggleClass() method to add or remove the “hide” class from the div element above the link element that’s clicked depending on whether that class is…arrow_forward
- Task 3 Create a web page named 'Multiplication Table.html that implements the 'Design Template' specified in Task 1. The title of the web page will be 'MultiplicationTable'. In this web page, implement a multiplication table (from 1 to 10) inside the content area of the template. You must use loop statement of JavaScript to implement the multiplication table. Here is the sample screenshot for Multiplication Table.html: Computer Engineering Technology - Web Programming 12141ATE ana C Ra e 3691a 11 122 412 1620428 2 36 4 U06 4744 00 71421 S 0 10 24 2 40 04 12 0 12764 4 2 Footerarrow_forwardHands-On Project 1-3In this project, you will explore how to write text to a specific element in your web page in response to theonclick event handler. To complete the exercise, you will apply the following JavaScript expression:document.getElementById('id').innerHTML = 'text';where id is the value of the id attribute for the page element and text is the text of the content to be writteninto the element. You will use this expression to enhance a web form by displaying the message “Thank you foryour order” when the user clicks the Submit button. Figure 1-25 shows the completed web page.Do the following:1. Use your code editor to open project01-03_txt.html from the HandsOnProject_01 folder. Enter your name and the date in the comment section of the document and save it as project01-03.html.2. Scroll down to the bottom of the file and locate the input element for the Submit button.3. Add an onclick event handler to the <input> tag that changes the innerHTML value of the page element…arrow_forwardPlease help me with this using HTML, CSS and Javascript 1. Create an HTML file that includes five buttons with the following labels: “recursive find A”,“recursive find B”, “recursive find C”, “recursive palindrome”, and “recursive count asterisks”. Create a div in your HTML to hold the results of calls to corresponding javascriptmethods. And a design a CSS code 2. Create a JavaScript file that responds to clicks of these buttons. All implementations shouldbe recursive. Thank youarrow_forward
- HTML/CSS Given the following HTML and the accompanying css, and the illustrated output for the section element A section element is another way of creating an outer div element. IN this case there is the div section , containing first a paragraph ,the margin below that in grey, then followed by the blue div- the outer flex container. The blue div has three divs inside it ( red, green and blue) If the margin below the paragraph is changed to 75px , the outer flex container height is changed to 400px, the 750px height is removed from the section element, what is the total height of the section element - do not include the thickness of the borders <html> <head> <meta charset="utf-8"></head><link rel="stylesheet" type="text/css" href="square12_with_pg.css"> <title>Squarespace layout</title> <body> <nav></nav> <header></header> <section> <!-- main…arrow_forwardMake the html/css/javascript code like this please. category1 = Korean traditionalcategory2 = European winecategory3 = Canadian beer each category has 7 items. Just leave item's names "item1, item2 etc..".descriptions and prices also.I will edit them later. You should use JavaScript Objects and Arrays! It should be dynamically Generated!arrow_forward: write HTML code that have •A Textarea with rows=4 and cols=36, labeled “Description”. •A checkbox group: Satisfied, Neutral, Dissatisfied, labeled “Rate Website” •A drop-down list (Select element) with these options: Saudi Arabia, China, USA,UK. Labeled “Country”.arrow_forward
- Imagine that the HTML file for your web page project includes a div element with the id value “cupcake” and you are writing a function to display and rearrange some images within that element. What JavaScript statement would you place in the blank to move the last image within the ccFrostingelement to the beginning of the line and shift the other images one position toward the end? let frostingFiles = ["pinkFr.jpg", "blueFr.jpg", "chocFr.jpg"] let frostingCount = frostingFiles.length; function frostCupcake() { let cupCake = document.getElementById("cupcake"); let ccFrosting = document.createElement("div"); cupCake.appendChild(ccFrosting); ccFrosting.id = "ccFrosting"; for (let i = 0; i < frostingCount; i++) { let image = document.createElement("img"); image.src = frostingFiles[i]; ccFrosting.appendChild(image); } function shuffleBack() { _____ } } a. ccFrosting.appendChild(ccFrosting.firstElementChild); b.…arrow_forwardIn HTML5, a <main> element was added to replace the legacy <div id="main"> we all used before. Where should this element be located in an HTML document, and how many such elements can exist? A) It should be a direct descendant of an <article> element and there can only be one such element. B) It should be a direct descendant of an <article> element and there can be more than one such element.C) It should be a direct descendant of the <body> element and there can only be one such element. D) It should be a direct descendant of the <body> element and there can be more than one such element.arrow_forwardWrite the whole HTML page from the DOCTYPE declaration to the closing HTML tag and code a web form that include the following requirements: Three inputs: First name, Last name, Email with appropriate labels and placeholder text; A drop-down list containing the following options: Student, Faculty; Two radio buttons containing the following options: Full-time, Part-time; Controls labeled "Send Registration" and "Clear All Fields". When the Send Registration control is clicked on, the user input will be sent to https://learndigital.dev/DGL103/dgl103-form.php for processing. When Clear All Fields is clicked, any data that was entered into the form is cleared. Make sure that all the data is sent securely. Add internal CSS (and extra HTML if you need to) so that your page looks like the image below. DON'T include more CSS than you need to: The form is 400px wide; The form is centred on the page and has a top margin of 40px; The text, email and select type inputs take up 100% of their…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 Education
Starting Out with Python (4th Edition)Computer ScienceISBN:9780134444321Author:Tony GaddisPublisher:PEARSON
Digital Fundamentals (11th Edition)Computer ScienceISBN:9780132737968Author:Thomas L. FloydPublisher:PEARSON
C How to Program (8th Edition)Computer ScienceISBN:9780133976892Author:Paul J. Deitel, Harvey DeitelPublisher:PEARSON
Database Systems: Design, Implementation, & Manag...Computer ScienceISBN:9781337627900Author:Carlos Coronel, Steven MorrisPublisher:Cengage Learning
Programmable 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