Styling the web page In this part of the project, styling will be applied to the framework created in HTML. CSS allows programmers to have much better control over the layout of their website. The look of the site can be kept consistent by using a single style sheet, which makes the maintenance of a website more efficient. This also saves time and makes it easy to update the design.
What the program does
Project requirements
Use the HTML elements of the web page created in Build a web page (see pp.216–33). You will use CSS to select and style these HTML elements individually in this second part of the project. Each element will be formatted according to its role and function, making the web page easier to navigate.
To add styling to your web page, you will need the HTML file and images folder from the first part of the project. You can continue using Visual Studio as the development environment.
Pet Shop
START
file:///PetShop/index.html Free shipping
PET SHOP Add visual styles and layout definitions for the HTML elements
Home About Shop Contact
HTML FILE
PET SHOP SHOP NOW
LOVE FISH
THE WIDEST RANGE OF FISHES
IMAGES FOLDER
Indoor and outdoor, we’ve got them all!
Check that the web page is easy to read and follow
CLICK FOR FISH
DEVELOPMENT ENVIRONMENT
END
PROGRAM DESIGN
Styled website The long vertical web page from the HTML part of this project will now appear styled, with clearly defined sections and formatted text and images. Adding CSS makes the web page more visual and individual.
