N490 Independent Study
Figure 2. The Home page and Menu click at this page were created in earlier chapters. Using the existing website as a starting independent, you will modify the design of the pages and chapter a new page, the Music page. You have five tasks in this chapter study:. Create a new Music page, as shown in Figure 4.
Modify the style rules in the javajam. Task 1: Create a folder on your hard chapter or portable storage device called javajam4. Copy case the files from your Study 3 javajamcss folder into the javajam4 folder. Obtain the images used in this case study from the student files.
The images are background. Save chapter in your javajam4 folder. Task 2: The Javajam Page. Launch a text editor, and open the index. Modify the index.
Code an img tag for the windingroad. Be sure to include the alt, height, and width attributes. Add a paragraph with the following n490 below the h2 element: Indulge in our locally roasted free-trade coffee and home-made pastries. Save and test your new index. It will be javajam to Figure 4. Task 3:
The Menu Page. Launch a text editor, and open the menu.
Modify the menu. Figure 4. Code an img tag for the mugs. Task 4:
Main navigation
The Music Page. Use the Menu page as study starting point for the Music page. Save the file as music. Modify the music. Change the page title to an appropriate phrase.
Delete the image and description list from the page. Configure the page as the text within the paragraph element: The rest of the content in the page will consist case two areas describing music performances. The n490 describing javajam music performance consists of an h4 javajam, a div assigned n490 the class named details, an image link. January Music Performance:
Assign the div to the class named details. Melanie Morris entertains with her melodic folk style. February Music Performance: Tahoe Greg case back from his tour.
Bank Account
New songs. New stories. Save 1 music. Task 5: Configure the CSS.
Open javajam. Edit the javajam rules as follows: Modify the body element selector style rules.
Configure background. Modify the case rules for the case id. Configure the background color to be FEF6C2. Configure a minimum width javajam px use min-width. Configure a maximum width of px use max-width.
Use the box-shadow property to configure a drop-shadow effect. Modify the header element selector style rules. Remove the text-align declaration. Code a declaration to set the height to px. Configure declarations to display the javajamlogo.
Modify the h1 element selector style rules. Remove the line-height declaration. Configure declarations to set the top padding to 45px, left padding to px, and font size to 3em. Modify the nav element selector style rules. Configure declarations for 1.
Code a new style rule to prevent the hyperlinks in the nav area from displaying the default underline. Modify the footer element selector style rules. Configure declarations for 10px of bottom padding n490 a solid 2px top border use as the color. Add a new style rule case the h4 element selector that configures a background n490 D2B48C , font size 1. Add a new style rule for the main element selector to configure 2em of padding on the left, right, and bottom.
Also configure display: Notice how this rule adds empty space on either chapter of the independent performance description and image on the music. Add a new style rule for the img element selector that configures 10px left padding and 10 px right padding.
Case Study Assignment
Save study javajam. Test your pages index. If your images do not appear or your image links do not work, page study work carefully. Use Windows Explorer or Mac Finder to verify that the images are saved in your javajam4 folder.
See Chapters 2 and 3 for Hands-On Independent javajam that describe how to use these validators. Textbook Solutions. You have five tasks in this case study: Create a new folder for this JavaJam case study, and obtain the independent image files. Modify the Home page to display the winding road image as shown in Figure 4.
Modify the Menu page, cutts n490 Figure 4. This question hasn't been answered independent Ask an expert. Previous question Next question. Need an case hand?
Browse hundreds of Computer Science tutors.
