Question

In: Computer Science

For this assignment, you can build on the 9th exercise that you made for the Assignment...

For this assignment, you can build on the 9th exercise that you made for the Assignment 1. So, you have a file named “band.html”.

  1. Create 2 more web pages besides band.html. All have to be in the same folder.
  2. You can redesign your band.html web page.
  3. Name each file as you wish (e.g., album names, tour, contact). They should also appear in the navigation bar. You can name your home page as Home in the navigation bar.
  4. Create an external style sheet named “band.css” in the same folder. You should configure all the styling in this file and create a link in your all 3 web pages.
  5. You should use all the properties below in your band.css file at least once:
    • background-color (use only hexadecimal color values)
    • color (use only hexadecimal color values)
    • font-family
    • font-size
    • font-style
    • font-weight
    • letter-spacing
    • line-height
    • text-align
    • text-decoration
    • text-indent
    • text-shadow
    • text-transform
    • width
    • word-spacing
  6. Use all the selectors (body, h1, h2, nav, nav a, p, ul, and footer) available in Figure 3.20 on page 108 in your textbook.
  7. Center all 3 web pages’ content with 80% width.
  8. Your navigation bar should contain links to all three pages, and when you click on any of the pages, it should transfer you to the web page.

Here is the band.html page that I did in the last assignment that this assignment starts off with:

<!DOCTYPE html>

<html lang="en">

<head>

<title>Assignment One</title>

<meta charset="utf-8">

</head>

<body>

<!--HTML to display name with largest heading element -->

<h1>My Name</h1>

<hr>

<!-- absolute link to school website -->

<a href="https://www.uncg.edu/">UNCG</a>

<hr>

<!--Unordered list to display days of the week -->

<h3>Week Days</h3>

<ul>

<li>Sunday</li>

<li>Monday</li>

<li>Tuesday</li>

<li>Wednesday</li>

<li>Thursday</li>

<li>Friday</li>

<li>Saturday</li>

</ul>

<hr>

<!--4 -->

<h3>Ordered List</h3>

<!--Ordered list -->

<ol type="A">

<li>HTML</li>

<li>XML</li>

<li>XHTML</li>

</body>

</html>

Website Section

<!DOCTYPE html>

<html lang="en">

<head>

<!--title for web page -->

<title>My Favorite Musical Group</title>

<meta charset="UTF-8">

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

</head>

<body>

<h1>My Favorite Musical Group: Old Dominion</h1>

<h3>Group Members:</h3>

<!-- Unordered list -->

<ul>

<li>Matthew Ramsey</li>

<li>Trevor Rosen</li>

<li>Brad Tursi</li>

<li>Geoff Sprung</li>

<li>Whit Sellers</li>

</ul>

<h3>Albums:</h3>

<!--Description List -->

<dl>

<li>Happy Endings (2017) - This album is my favorite of all their albums. It contains some well-known songs, such as "No Such Thing as a Broken Heart," "Hotel Key," and "Written in the Sand." </li>

<li>Meat and Candy (2015) - This album was their first album and it really set the tone for the rest of their music to come. It was an overall very vocally strong album. </li>

</ol>

<hr>

<!--hyperlink -->

click here for <a href="https://www.weareolddominion.com/">more details</a>

</body>

</html>

Solutions

Expert Solution

For the above question i'm done with my answer.

First check the output

Now this is the band.html

<!DOCTYPE html>

<html lang="en">

<head>

<title>Assignment One</title>

<meta charset="utf-8">

</head>
<link href="band.css" rel="stylesheet" type="text/css"> <!--Adding stylesheet -->
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet"> <!--Adding google fonts -->
<body>
<center>
<!--instead of nav use ul and li -->
   <div class="content-center">
               <div class="navigationbar">
                   <a class="active" href="band.html">Home</a>
                   | <a href="contact.html">contact</a>
                   | <a href="tour.html">tour</a>
               </div>
          
      
<!--HTML to display name with largest heading element -->

   <h1>My Name</h1>

       <hr>

<!-- absolute link to school website -->

   <a href="https://www.uncg.edu/" style="color:#FFFFFF; font-weight:bold">UNCG</a>

       <hr>

<!--Unordered list to display days of the week -->

<h3>Week Days</h3>

<ul>

<li>Sunday</li>

<li>Monday</li>

<li>Tuesday</li>

<li>Wednesday</li>

<li>Thursday</li>

<li>Friday</li>

<li>Saturday</li>

</ul>

<hr>

<!--4 -->

<h3>Ordered List</h3>

<!--Ordered list -->

<ol type="A">

<li>HTML</li>

<li>XML</li>

<li>XHTML</li>

</body>

</html>

Here band.html is completed and now this is band.css


footer
{
}
.content-center
{
   background-color:#000000;
   color:#FFFFFF;
   height:auto;
   width:80%;
   text-indent: 5px;
}
h1
{
   font-family: 'Roboto', sans-serif;
   text-shadow: 2px 2px #ff0000;
   line-height:2px;
}
.navigationbar
{
   background-color:#FF0000;
   height:50px;
   width:100%;
   font-size:24px;
   text-align:left;
   }
.navigationbar a
{
   color:#FFFFFF;
   font-style:normal;
   font-weight:bold;
   text-decoration:none;
   word-spacing: 30px;

}
ul
{
   text-align:left;
}
ol
{
   text-align:left;
  
}

Now, the 2 pages as described in question

1 page tour.html

<html>
   <head>
       <title>tour.html</title>
   </head>
   <link href="band.css" rel="stylesheet" type="text/css">
   <body>
       <center>
           <div class="content-center">
               <ul>
                   <li><a class="active" href="band.html">Home</a></li>
                   <li><a href="contact.html">contact</a></li>
                   <li><a href="tour.html">tour</a></li>
               </ul>
           </div>
       </center>
   </body>
2 page contact.html

<html>
   <head>
       <title>contact.html</title>
   </head>
   <link href="band.css" rel="stylesheet" type="text/css">
   <body>
       <center>
           <div class="content-center">
               <ul>
                   <li><a class="active" href="band.html">Home</a></li>
                   <li><a href="contact.html">contact</a></li>
                   <li><a href="tour.html">tour</a></li>
               </ul>
           </div>
       </center>
   </body>
these web pages are performed very well, and the links are also working, please check the links and the requirement of the selectors. this selectors are used in band.css, as well as, in band.html.

venereology answered 1 month ago
Next > < Previous

Related Solutions

In this assignment, you will be selecting a product of interestand you will build a...
In this assignment, you will be selecting a product of interest and you will build a sales strategy to improve the sales performance for that product. A product is only one of the four pillars of a marketing strategy, and so you will need to build a thorough understanding of how the price of this product is set, what channels are available for the physical housing and distribution of the product, and how this product will be promoted (commonly referred...
The assignment is to build a program in Python that can take a string as input...
The assignment is to build a program in Python that can take a string as input and produce a “frequency list” of all of the wordsin the string (see the definition of a word below.)  For the purposes of this assignment, the input strings can be assumed not to contain escape characters (\n, \t, …) and to be readable with a single input() statement. When your program ends, it prints the list of words.  In the output, each line contains of a...
In this assignment, which continues to build on last week's assignment, you will create a mind...
In this assignment, which continues to build on last week's assignment, you will create a mind map identifying the steps in the training process for a CRM program to help you understand the important role training plays in an organization. It further helps you understand the importance of training as you explore how training is designed, delivered, and measured for success I need more info on what a CRM is and Which training evaluation methods would you recommend to assess...
Your assignment is to build a program that can take a string as input and produce...
Your assignment is to build a program that can take a string as input and produce a “frequency list” of all of the words in the string (see the definition of a word below.) For the purposes of this assignment, the input strings can be assumed not to contain escape characters (\n, \t, …) and to be readable with a single input() statement. When your program ends, it prints the list of words. In the output, each line contains of...
CS 400 Assignment 2: applying ArrayList In this assignment, you are going to build a program...
CS 400 Assignment 2: applying ArrayList In this assignment, you are going to build a program that can help rental car companies to manage their rental fleet. Requirement: - build ArrayList class as container. - build Car class/structure to represent car objects. - An ArrayList object is to hold Car objects. Car class should have following fields: - id (int) - make (string) - model (string) - color (string) Instructions: - make up 15 cars and save them into a...
For this assignment you will implement a dynamic array. You are to build a class called...
For this assignment you will implement a dynamic array. You are to build a class called MyDynamicArray. Your dynamic array class should manage the storage of an array that can grow and shrink. The public methods of your class should be the following: MyDynamicArray(); Default Constructor. The array should be of size 2. MyDynamicArray(int s); For this constructor the array should be of size s. ~MyDynamicArray(); Destructor for the class. int& operator[](int i); Traditional [] operator. Should print a message...
In this assignment you will build a small C# project that uses… • A struct •...
In this assignment you will build a small C# project that uses… • A struct • A method with a reference parameter • A while-loop • A switch statement and block instructions: Inside the StringHandler struct add a public void method named Abbreviate. The Abbreviate method must take a string parameter that is passed by reference. This method will take the name of a month (January, February, etc.) as its input and convert it to a 3-letter abbreviation of the...
For this assignment you are required to build a system using BBC Micro:bit device. You will...
For this assignment you are required to build a system using BBC Micro:bit device. You will use the Micro:bit to gather data automatically using its sensors; and make it available on the internet. You are to deliver this data in a rigorous fashion to a PC attached via USB using the onboard Python, and then to run a local Python server on the PC with appropriate web pages to serve the result locally. Remote access to the PC is not...
1. For this assignment you will need to first build a graph to these specifications: Draw...
1. For this assignment you will need to first build a graph to these specifications: Draw a downward sloping demand curve with vertical intercept (0,150) and horizontal intercept (25,0). Draw a supply curve with vertical intercept (0,50) and with slope=4 i.e. the market equilibrium occurs at (10, 90). a. Compute consumer, producer, and total surplus at the market equilibrium. b. Label consumer surplus and producer surplus if the government imposes a price floor of $120, then compute deadweight loss. c....
For this assignment, you are going to build upon several skills that you've learned: Create an...
For this assignment, you are going to build upon several skills that you've learned: Create an object that contains objects. Using querySelectorAll to read a nodeList from the DOM. Looping through the nodeList then updating the HTML page. Set up Create the assignment in a "week6" folder with the typical files: index.html css/styles.css js/scripts.js This is the standard structure that we'll use in all assignments. Here is the HTML to use for this assignment. Change the meta author tag to...
ADVERTISEMENT
Subjects
ADVERTISEMENT
Latest Questions
ADVERTISEMENT