User Tools

Site Tools


en:web_development:layout:exercises

Web Development Lesson 5 - Layout

Exercises

Objective

In this activity you'll practise changing the layout and using 'include' to ensure site consistency.

Setup

  • We'll work on the files you've created in your directory using Visual Studio Code.

Layout

  • Open 'style.css' in your directory (not 'project/style.css').
  • Using CSS only (ie without changing anything in 'layout.php'), modify your page so that the header runs across the full length of the page and the navigation section starts just below that and runs to the bottom of the page.

PHP Include

  • Create files called 'team.php', 'header.php', 'menu.php' and 'footer.php' in the 'project' directory.
  • Apply the same process you used to split up your 'layout.html' file on 'team.html'.
  • Upload the files to your 'project' directory on the server.
  • Browse to the files to check that your changes worked.

Next: Summary

en/web_development/layout/exercises.txt · Last modified: 2023/08/16 09:33 (external edit)