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
Question
Chapter 8, Problem 2AYK
Program Plan Intro
Program Plan:
- Include the HTML tag using <HTML>.
- Include the header tag using <head>.
- Include the title on the webpage using <title> tag.
- Provide the background color and border for the table using <style> tag.
- Close the header tag using </head>.
- Open the body of the web page using <body> tag.
- Include the heading on the webpage using <h1> tag.
- Include a table on the webpage using <table> tag.
- Include a caption on the webpage using <caption> tag.
- Provide table headings using <th> tag
- Provide table content using <td> tag
- Close the body using </body> tag.
- Include the header tag using <head>.
- Close the file using </html> tag.
Expert Solution & Answer
Want to see the full answer?
Check out a sample textbook solution
Students have asked these similar questions
4. The following code is the implementation of the external CSS style. Convert the following
code into inline CSS style.
Question4.css
Collapse Border
Example
Cell A Collapse
Example
Cell B Collapse
Example
Separate Border
Example
Cell A Separate
Example
Cell B Separate
Example
1.css
table.one
{border-collapse:collapse;}
table.two {border-collapse:separate;}
td.a{
border-style:dotted;
border-width:3px;
}
border-color:#000000;
padding: 10px;
}
td.b {
border-style:solid;
border-width:3px;
border-color: #333333;
padding:10px;
11. Template Creation
Create a template to display an HTML page like below.
Create a template with 4 columns and 3 rows.
You can choose any approach to finish this task.
This task only using HTML and CSS, please make sure your code already
tested before you submit it.
item 1
item 2
item 3
item 4
item 5
item 6
item 7
item 8
item 9
item 10
Body padding is 20px
Border color is #e3e3e3
Text color is #727272
Text size is 12px
Distance between icon and box is 10px
Border radius size is 10px
Icon asset image is https://a.m.dana.id/promo/landing-page/default-
icon.webp
Web development
Chapter 8 Solutions
Web Development and Design Foundations with HTML5 (8th Edition)
Ch. 8.4 - Prob. 1CPCh. 8.4 - Prob. 2CPCh. 8.4 - Prob. 3CPCh. 8.7 - Prob. 1CPCh. 8.7 - Prob. 2CPCh. 8 - Prob. 1MCCh. 8 - Prob. 2MCCh. 8 - Prob. 3MCCh. 8 - Prob. 4MCCh. 8 - Prob. 5MC
Ch. 8 - Prob. 6MCCh. 8 - Prob. 7MCCh. 8 - Prob. 8MCCh. 8 - Prob. 9MCCh. 8 - Prob. 10MCCh. 8 - Prob. 11FIBCh. 8 - Prob. 12FIBCh. 8 - Prob. 13FIBCh. 8 - Prob. 14FIBCh. 8 - Prob. 15FIBCh. 8 - Prob. 1AYKCh. 8 - Prob. 2AYKCh. 8 - Prob. 3AYKCh. 8 - Prob. 1HOECh. 8 - Prob. 2HOECh. 8 - Prob. 3HOECh. 8 - Prob. 4HOECh. 8 - Prob. 5HOECh. 8 - Prob. 6HOECh. 8 - Prob. 7HOECh. 8 - Prob. 8HOECh. 8 - Prob. 9HOECh. 8 - Prob. 1WRCh. 8 - Prob. 1FWD
Knowledge Booster
Similar questions
- QUESTION 15 Assume you have the following html code: * Your code goes here / Home Service About us Contact us Add the following internal CSS styling rules to the code you may use CSS class selectors as needed: 1. Remove the marker of the unordered list containing hyperlinks. 2. Remove the underlines from the hyperlinks. 3. Put an appropriate distance between the hyperlinks. 4. The hyperlinks should be displayed horizontally (beside each other). 5. Set an appropriate background color for navigation bar. 6. Make the hyperlink underline visible when mouse hover on all the hyperlinks. Home Ahout Contoot unarrow_forwardJavascriptarrow_forwardWeb Programming : HTML, CSSarrow_forward
- Part 4: Build a html form with the following elements. The form must be within a table structure. Name: a text box where the content contains no special character (i.e. !, @, #, $, %, &, *). Number is allowed. The text box must not be empty. • Module code: a text box where the content must start with 3 lower case alphabets and follows by 4 digits. This textbox can be empty. • Current date: a non-editable textbox and should be in the format as shown (e.g. 12 October 2020 Monday 3:35 PM). The content is the current date or today's date which will change every day. • Message: a text area with 3 rows and 20 columns. The default text is "Hello 202204". The text area cannot be empty. • Find: a text box for the user to key in text he/she wants to find. Replace: a text box for the user to key in the replacement text. If the find text is empty, this element should be disable (i.e. user cannot key in anything here). • Find and Replace: This is a button, when click, it will go to the "Message"…arrow_forwardhtml/cssarrow_forwardOpen your text editor: Please complete this code in HTML create a new file and name it “Lec_Ex4_2.html” create a new file and name it “style_2.css” Type the 8 lines in the html(basic html structure). Add this line to the head section of html: Write these lines in the body of the html: <div id=“title”><h1>Your name</h1></div> <div id=“container1”> . </div> Style it in the CSS: #title{ background-color:blue;} #container1 {background-color:red;} If we don’t specify the width of the div element,it will take up the full width available. We can specify the width and height of the divusing percentages or pixels. Percentages are flexible (changes according tothe screen size), and pixels are fixed. Add the following property to both divs: Width:80%; This is comparing to the full screen For the title div: Padding:2%; For the container div: Height: 400px; Height can also be made with percentages, butpixels are preferred. Your…arrow_forward
- Based on the following specification, code one webpage using HTML5, CSS and JavaScript. HTML5: Three label elements with IDs lblTarget1, lblTarget2 and lblTarget3 Two buttons with IDs btnA and btnB. Both buttons invoke function fManipulate when clicked JavaScript: Code a function named fManipulate that Accepts one parameter containing an object that represents the clicked button Check to see which of the two buttons invoked this function If fManipulate function was invoked by btnA then change the text color of lblTarget1 to red by using the getElementById method If fManipulate function was invoked by btnB then change the font of ALL three labels by first using the getElementsByTagName method to return a collection of labels then use a for loop to iterate through the collection of labels to change the font of each label to calibriarrow_forwardUsing Inline style do the following for this hl>: Using Embedded style do the following for this : Using Embedded style do the following for thisarrow_forwardHTML In strictly default block vertical coordinates, the reference positions for the next element placement on the page is the location of the element immediately on top and the left-hand screen position. (TRUE OR FALSE)? If an outer div container contains two inner div elements, and an outer height is given by css to the outer container, and the background color of the outer container is blue then there will always be blue colored space left below the two inner divs (TRUE OR FALSE)? Image elements can have borders surrounding them , and maintained inside a containing element. (TRUE OR FALSE)? In table elements, the most specific HTML level is the tr element ( row element)(TRUE OR FALSE)? Text can be centered inside a div element by using the selector command text-align: center or otherwise placing the text inside another div element with the same background color and applying margin-left command( TRUE OR FALSE)? A paragraph, div element, and h element will assume the…arrow_forwardthis is the "index page "code index .hbs<!DOCTYPE html><html><head><link rel="stylesheet" href="./data/l.css"></head><body><div class="flex"><div class="element-center"><div id="acctBalance"><span class="wrap"></span></a><h1>Total Balance</h1><label id="acctBalanceLbl"></label><input id="txtid" name="txtid" type="text" maxlength="10" placeholder="Accountnumber"><br><br></div><div id="inputs"><h2>Deposit</h2><input type="text" id="userDeposit" required><button id="btnDeposit">Deposit</button><h2>Withdraw</h2><input type="text" id="userWithdraw" required><button id="btnWithdraw">Withdraw</button><label id="usernameLb2"></label>// add label for displaying user name</div></div></div><script type="text/javascript" src="bank_account_script.js"></script><script…arrow_forwardthis is the "index page "code index .hbs<!DOCTYPE html><html><head><link rel="stylesheet" href="./data/l.css"></head><body><div class="flex"><div class="element-center"><div id="acctBalance"><span class="wrap"></span></a><h1>Total Balance</h1><label id="acctBalanceLbl"></label><input id="txtid" name="txtid" type="text" maxlength="10" placeholder="Accountnumber"><br><br></div><div id="inputs"><h2>Deposit</h2><input type="text" id="userDeposit" required><button id="btnDeposit">Deposit</button><h2>Withdraw</h2><input type="text" id="userWithdraw" required><button id="btnWithdraw">Withdraw</button><label id="usernameLb2"></label>// add label for displaying user name</div></div></div><script type="text/javascript" src="bank_account_script.js"></script><script…arrow_forwardTrue or false: the "id" property should be used to style multiple HTML elements simultaneously. a. false b. truearrow_forwardarrow_back_iosSEE MORE QUESTIONSarrow_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