Question

In: Computer Science

Chapter 4 Assignments - Part #1 (Part #2 is on next page) Submit an HTML file...

Chapter 4 Assignments - Part #1 (Part #2 is on next page)

Submit an HTML file attached to an email with your web page containing the elements below.

- Create a web page with a comment containing your name after this line.

o

- In the head section, add character encoding.

- Add the title "Chapter 4 Web Page #1 - by yourname"

- Create a file called myStyles.css as the style sheet for the web page.

- Add the link for the style sheet in the index.html file.

- Create a banner ~180x800 for the web page using Snip, Paint, PowerPoint, or another program and add the banner (non-elastic banner) to the web page by creating a banner class in the style sheet and a "div" in index.html.

o Include a graphic and text in the banner.

- In the style sheet, redefine h1 as Tahoma, green, and 30 pixels.

- In the style sheet, redefine h2 as Arial, blue, and 20 pixels.

- Create a page box class in the style sheet with a background color and center the box on the page.

o Use a padding of 20%, and width of 80%, and a rounded corner border of 15px radius and 3px thick of some color.

o Inside the page box, add the text shown and answers to the questions below.

o Make the page box as wide as the banner regardless of browser resizing.

- Create a footer class with your name, the copyright symbol, and year centered.

o The footer will have a color background, a border 1 pixel thick that is a different color than the background.

o The footer text will use h3 and be white and italic o The footer text will be padded with 2 pixels top and bottom

Questions:

1. CSS documents the ________________ status of each style property.

2. CSS is used to define _________ _________ and attach them to HTML elements.

3. This statement /* browser note */ is a ____________ in CSS.

4. The _______ element for a CSS is placed inside the head element of the page.

5. The ____________ associates a rule to a set of HTML elements.

6. a:visited { color: #300 } will make __________ _________ red.

Solutions

Expert Solution

Solution for the above questions:-

(1) CSS documents the current status of each style property.

(2) CSS is used to define style for unique element and attach them to HTML elements.

(3) This statement /* browser note */is a comment in CSS.

(4) The <style> element for a CSS is placed inside the head element of the page.

(5) The <fieldset> associates a rule to a set of HTML elements.

(6) a:visited { color: #300 } will make 0% red.

SOURCE CODE:-

index.html

<!DOCTYPE html>

<!-- MY NAME -->

<html lang="en">

  <head>

    <meta charset="UTF-8" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <link rel="stylesheet" type="text/css" href="myStyles.css" />

    <title>Chapter 4 Web Page #1 - by Name</title>

  </head>

  <body>

    <div class="banner">

      <p>Welcome to my website</p>

      <img src="banner.png" />

    </div>

    <div class="Pagebox">

      <h1>HTML Page box using CSS</h1>

      <h2>&nbsp;&nbsp;&nbsp;&nbsp;Answers</h2>

      <ol>

        <li>Answer 1</li>

        <li>Answer 2</li>

        <li>Answer 3</li>

        <li>Answer 4</li>

        <li>Answer 5</li>

      </ol>

    </div>

    <div class="footer"><h3>myname©2020</h3></div>

  </body>

</html>

myStyles.css

.banner {

  display: flex;

  justify-content: center;

}

.banner p {

  position: absolute;

  color: yellow;

  font-size: 40px;

  font-weight: bold;

  font-family: "Franklin Gothic Medium", "Arial Narrow", Arial, sans-serif;

}

h1 {

  font-family: Tahoma;

  color: green;

  font-size: 30px;

}

h2 {

  font-family: Arial;

  color: blue;

  font-size: 20px;

}

.Pagebox {

  width: 500px;

  padding-right: 20%;

  border: 3px yellow solid;

  border-radius: 15px;

  background-color: lightblue;

  margin: auto;

  margin-top: 20px;

}

.Pagebox > h1 {

  display: flex;

  justify-content: center;

}

.footer {

  display: flex;

  justify-content: center;

  padding: 2 0 2 0;

  background-color: lightblue;

  border: 1px red solid;

  margin: auto;

  margin-top: 20px;

  width: 800px;

}

.footer h3 {

  color: white;

  font-style: italic;

}

li {

  font-weight: bold;

  font-size: 20px;

}


Related Solutions

DIET ANALYSIS PART 4 : NO FILE NEEDS TO BE ATTACHED FOR THIS SECTION. Cannot submit...
DIET ANALYSIS PART 4 : NO FILE NEEDS TO BE ATTACHED FOR THIS SECTION. Cannot submit part 4 if you have not submitted part 1-3. Review SAM: SUBJECT: SAM Age: 39 Birthdate:7/14/1980 Height: 6 feet 2 inches Weight: 312 pounds Waist circumference: 65 inches Sam works at the local Wells Fargo Bank. He is a Branch Manager He works 40 hours per week. Sam spends a lot of his time behind a desk working for his clients. He smokes cigarette...
Part 1: Model Building 1. Submit both this word and excel file 2. Keep two decimal...
Part 1: Model Building 1. Submit both this word and excel file 2. Keep two decimal places for your answer Using the data Reynolds.xls. The variables are defined as: Sales (Y) =number of electronic laboratory scales sold Months (X) =the number of months the salesperson has been employed 1. Develop the scatter plot using Sales as y axis and Months as x axis, and can you see the curvature? 2. Using a simple linear regression model to develop an estimated...
Create a Home Page using HTML and CSS Part 1 • Contain an image or logo...
Create a Home Page using HTML and CSS Part 1 • Contain an image or logo about your website. • Must contain three navigation links. Home link. Registration link. Animations link. • Footer will contain links to web pages to any other site you wish (just be outside your webpage, like YouTube,etc.) Open links in new tab, not current tab. Create a Registration page: • Registration Fields: 1) User Name - Input Text 2) Password - Input Password 3) Repeat...
Please finish the following assignments in Excel and submit the Excel file onto Pilot. Please use...
Please finish the following assignments in Excel and submit the Excel file onto Pilot. Please use the data in “GPS.XSLS” to: Q1. Estimate the parameter p and q in Bass Model. Q2. Compute the time and value of peak sales. Year Sales (00s) 1990 164 1991 276 1992 578 1993 1604 1994 3435 1995 5785 1996 8500 1997 12000 1998 15000 1999 18000 2000 20000 Please show the steps thank you
Write an HTML file for a web page that contains the items below. Use an internal...
Write an HTML file for a web page that contains the items below. Use an internal style sheet to specify all fonts, sizes, colors, and any other aspects of the presentation. Your page should contain the following items: 1) A header with white text on dark green background (just for the header, not the entire page), in Impact font, bold, and centered. 2) Two paragraphs of text, each with dark gray text in Tahoma font, on a light blue background,...
Week 4 Assignment HTML – Creating a Simple Web Page “HTML or HyperText Markup Language as...
Week 4 Assignment HTML – Creating a Simple Web Page “HTML or HyperText Markup Language as it is formally known is the main markup language for creating web pages and other information that can be displayed in a webbrowser”. It was created by Tim Berners-Lee in 1989 as a user friendly way of sharing information on the Internet. http://en.wikipedia.org/wiki/HTML Assignment Instructions - Create a simple HTML Web Page that includes hyperlinks to three of your favorite websites. Use the online...
Assessment – Module 4 Directions: Complete these questions and submit to the correct Assignments folder on...
Assessment – Module 4 Directions: Complete these questions and submit to the correct Assignments folder on D2L. Please upload as a Word document (.docx) or a .pdf. You can print this and write in the space provided, type your answers here, or write answers on a separate sheet of paper and upload photos. If you upload photos, please put page numbers on your pages and make sure the photos aren’t blurry. Note: Sometimes the book isn’t so good at giving...
1. An HTML document that’s generated by a web application is a ________________________ web page. 2....
1. An HTML document that’s generated by a web application is a ________________________ web page. 2. An easy way to log the progress of an application in Chrome’s Console panel is to insert __________________ methods at critical points in the code. 3. The childNodes property of a DOM object returns a/an ______________________ of the child nodes for that object. 4. The ___________________ method of an array can be used to concatenate the elements of the array into a single string.​...
Create following webpage in HTML : 1. Login Page This is the first page the user...
Create following webpage in HTML : 1. Login Page This is the first page the user should see. The user can login, signup, or continue as a guest. Your task is to implement the following features: a) Signup form This form should collect the information required for creating a new account on your movie database website. At the least, it should collect an email address, username, avatar image/graphic, first name, last name, and a password. You can ask for more...
1.Briefly describe the traditional connection process for getting and displaying an HTML page. 2.Which of these...
1.Briefly describe the traditional connection process for getting and displaying an HTML page. 2.Which of these statements is most correct?(please give some reasons) a) Browsers create a link with the server for displaying images b) Browser provides an environment for displaying HTML and running JS c) Browsers allow a page to have style and layout d) Browsers provide an environment for running JS and displaying CSS 3. HTML uses ________ to create areas that obey display criteria and can further...
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT