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
Question
Chapter 3, Problem 5HOE
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.
- Include the style on the webpage using the <style>tag.
- Close the style tag using </style>.
- Define a class called .new that is bold and italic
- Include the hyperlink tag to refer to the link using href attribute
- Include the title on the webpage using <title> tag.
- Close the header tag using </head>.
- Open the body of the web page using <body> tag.
- Include the content to be displayed in the webpage using paragraph <p> 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 solutionStudents have asked these similar questions
Write an HTML program to create an EXTERNAL Style sheet using <style> element and format it with the following properties : a) Body- font-size ,font-family ,background-color ,color b) H1- color: red; border-width:1; border:solid; text-align:center Display your name using <H1 > element. Write some information about your Favourite TEACHER using <body> element.
Make the button timer and reset work, also make the cards to be flipped over and make them to be in random order, when you match two correct cards let them be flipped, if they are not matching flipdem back. Do this in JavaScript.
html code:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="start.css">
<title></title>
</head>
<body>
<div class="whole">
<div class="images"><img src="1.png"></div>
<div class="images" ><img src="final.jpg"></div>
<div class="images"><img src="2.png"></div>
<div class="images"><img src="final.jpg"></div>
<div class="images"><img src="final.jpg"></div>
<div class="images"><img src="4.png"></div>
<div class="images"><img src="final.jpg"></div>
<div class="images"><img src="3.png"></div>
<div…
How to make this more responsive so that when the screen is small picture and texts will be written in the seperate lines (picture - upper side; texts lower side instead of left - picture and right - text as shown in the pictures)
css file:
.image-text-container {
display: flex; /* Arrange elements horizontally */
align-items: center; /* Align content vertically */
margin: 20px; /* Add some margin around the container */
}
html file:
<div class="image-text-container">
<figure>
<imgsrc="washFace.png"alt="Picture of a woman washing his face"class="full-width-image">
</figure>
<article>
<h2>Wash your face with water</h2>
<p>First off, start by splashing your face with water. It's crucial to clear away the dirt and oil that gathers while you sleep. However, cleanser isn’t needed in the morning; lukewarm water works best. <p>
</article>
</div>
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
- Please help me with the following exercise. Use your programming environment to generate a simple Web site using Python flask. The site should be unique, include at least 3 routes (e.g. 3 pages one can navigate), each route should render the HTML pages by using the render_template() functionality. A style sheet should be included that is used by all Web pages. Proper organization should take place of the web site including the location of templates and static pages. Keep in the basic HTML form for a function web page includes the following components: <!DOCTYPE html><html><head><title>Page Title</title></head><body>...your page content...</body></html> In addition to the requirements list above the following functionality should be found within your web site on one or more web pages.• Use at least 3 different heading styles (e.g. <h1>, <h2>, <h3>)• Paragraph (<p>)• Comments <!-- -->)• Ordered list•…arrow_forwardJavascript allowsWrite a page using a balloon emoji (?). When you push the up arrow, it should increase 10%, and when you press the down arrow, it should decrease 10%.Emoji are text, hence adjusting its parent element's font-size CSS property (style.fontSize) controls its size. Remember to provide a unit, such as pixels (10px)."Arrow Up" and "Arrow Down" are the arrow keys. Make sure the keys modify the balloon without scrolling.arrow_forwardQ2 Design a web page (name it q2.html), which uses Bootstrap framework, to display the following sentence: Web Development for Mobile Devices. The sentence should appear as heading1 (i.e., hl) with font size 60 points and red border of 8px thickness if the page to be displayed on PC screen. If the page is displayed on a tablet screen, the sentence should appear as heading 3 with font size 30 points and blue border of 5px thickness. Finally, if the page displayed on mobile screens, then the sentence must not be displayed, and replaced with the sentence (Too small screen!) in "red" text color: Q3 Analysis, and Comments. The tab-page of Result tab must include three cards of three different must appear horizontally in one line for small and larger screens, and vertically for mobile screens. items (of your own selection). The card includes Title, Picture, and Price (in JD) of that item. The cards The tab-page of Analysis tab includes a table of three columns (with titles of your own…arrow_forward
- Web 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_forwarda.menu {font-family : Verdana; font-weight : bold; font-size : 13px; } To use the CSS style above, which of the following should be done? "a.menu" class must be imported for a hyperlink menu. "a.menu" class must be imported for a hyperlink. "menu" class must be imported for a hyperlink. "a" class must be imported for a hyperlink.arrow_forwardModernizr is a tool that supplements deficient browser functionalities, with the exception of style support for HTML5 tags.arrow_forward
- Lab Exercise 1 Design a web page to and display the text “Welcome to Oman" using java script. Try the different methods of including javascript into a web page. Lab Exercise 2 Find the HTML element (with id="demo"), and changes the element content (innerHTML) to the current date and time value: Lab Exercise 3 Find the HTML element (with id="demo"), and changes the element content (innerHTML) to "Hello JavaScript": Lab Exercise 4 Design one HTML page with that will print the sum and product of two integer numbers with the help of javascript variables. Lab Exercise 5 Program to demonstrate the use of javascript Alert box. Lab Exercise 6 Program to demonstrate the use of javascript Confirm box. Lab Exercise 7 Program to demonstrate the use of javascript Prompt box.arrow_forwardSuppose there is a text box on your browser window called FirstName. When you scroll up or down, the text box does not move at all while other elements on the page do move. What value for the position property would FirstName have? A) absolute B) relative C) fixed D) staticarrow_forwardWrite an HTML program to create an EXTERNAL Style sheetusing <style> element and format it with the following properties : a) Body- font-size ,font-family ,background-color ,color b) H1- color: red; border-width:1; border:solid; text-align:center Display your name using <H1 > element.arrow_forward
- Write your name and university ID then rotate it, take a screen shot insert that same in web page using HTML program. Write a javascript program to insert a video or audio. Animate any one polygon shape as it is bouncing in the screen.arrow_forwardNonearrow_forwardReplace the following comments with the appropriate JavaScript code. Changing color and font-size example function changeText () { // select the paragraph having "pid" as id // Change the text of the selected paragraph to Click here // Change the color of the selected paragraph to red //Change the font size of the selected paragraph to 18 points // locate the parent node of the paragraph and store the location in a variable // Change the background color of the parent to blue /head> linkerarrow_forward
arrow_back_ios
SEE MORE QUESTIONS
arrow_forward_ios
Recommended textbooks for you
- EBK JAVA PROGRAMMINGComputer ScienceISBN:9781337671385Author:FARRELLPublisher:CENGAGE LEARNING - CONSIGNMENTSystems ArchitectureComputer ScienceISBN:9781305080195Author:Stephen D. BurdPublisher:Cengage Learning
EBK JAVA PROGRAMMING
Computer Science
ISBN:9781337671385
Author:FARRELL
Publisher:CENGAGE LEARNING - CONSIGNMENT
Systems Architecture
Computer Science
ISBN:9781305080195
Author:Stephen D. Burd
Publisher:Cengage Learning