JavaJam: Home page; Menu page; Music page f. How does the US WEBSITE CASE STUDY
ID: 3743911 • Letter: J
Question
JavaJam: Home page; Menu page; Music page
Explanation / Answer
Hi this is a very long case study and requires a lot of time and explanation. But I will try my best to brief it up for you but also will explain the important parts for you to understand and complete your case study. Incase you still need more explaination required please provide comments so that I can help you better.Please follow the steps below and also go through the comment section:
1. First of all please create a separate folder for your case study to make your website work more manageable. you can give a name to it lets say javaJam nad then create a subfolder with a name images. where you can keep all your images you want in your website. As the home page is created earlier in this chapter , you can just copy paste those files to your new folder javaJam.
2. As you need to modify your home page with this new image. Kindly go to the source file of this image with .html extension. now you need to add an image tag <img> to insert an image to your existing page.It will have a src property. so provide your path in this particular src property like this . <img src = "images/image.jpg"/>. now images is the folder which we created inside a javaJam folder to store our image files. and it is followed by /image.jpg. now image.jpg is the file name of your image you want to insert in your web page. you can also provide width and height to the image accordingly. for that you have to write it like : <img src="images/image.jpg" width="50" height="60">.
3. To make it more consistent you need to have a proper css defined in your website. To make your home page consistent with your menu page you need to use same css class for both the web pages. kindly create a css with same font size. same padding and margin property. Same backgroundcolor and color of your font.
e.g.
h2 {
background-color: #white;
text-color: #000000;
font-size: 1.0em;
padding-left: 8px;
padding-bottom: 4px;
line-height: 100%;
text-align: center;
}
define your property as per your requirement.
4. below is the solution for Music.html page
<head>
<meta charset="UTF-8">
<title>JavaJam Coffee House</title>
<link rel="stylesheet" type="text/css" >
</head>
<body>
<h1>
<img src="javajamcoffee.jpg" alt="JavaJam Coffee House"
width="719" height="137">
</h1>
<ul>
<li><a>Home</a></li>
<li><a>Menu</a></li>
<li><a>Music</a></li>
<li><a>Jobs</a></li></ul>
<main>
<h2> Coffee At JavaJam</h2>
<br/>
<p>The first friday night each month at javajam is a specified night.Join us from 5 pm to 11 pm for some music you wont want to miss.</p>
<br/>
<span><h4>January</h4></span>
<br/>
<p><img src="images/mellanie.jpg"/>Mellanie Morris entertains with er melody folk style.</p> <!-- in the img tag please enter the exact name of the image which you are using.and store that image inside the images folder -->
<br/>
<span><h4>February</h4></span>
<br/>
<p><img src="images/greg.jpg"/>Tahoe Geg is back from his tour. new songs. new stories</p><!-- in the img tag please enter the exact name of the image which you are using.and store that image inside the images folder -->
</main>
<footer>
<p align="center">Copyright © 2016 Javajam Coffee House</p>
<p align="center"><a href="college1.edu">a@college.edu</a>.</p>
</footer>
</body>
</html>
5. Necessary changes for your CSS file:
img {
border: none;
}
h1 {
text-align: center;
background-color: #ccaa66;
text-color: #000000;
}
body {
background-image:url(images/backgroundimage.gif); // kindly provide the image path you want to provide in the background
font-family: sans-serif;
text color: #330000;
padding:25px;
}
h3 {
text-color: #000000;
background-color: #ccaa66;
line-height: 200%;
text-align: center;
font-size: 1.2em;
padding-left: 10px;
padding-bottom: 5px;
}
Hi, if you still feel there is more to be done . please let me know.
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.