Static Layout Page

Contributed by Chaoyang Li

Introduction

Static Layout has fixed content.It is the easiest layout of website to create.Static websites are build of HTML, CSS, and JavaScript.

Static Layout is quick and easy to create and cheap to host. It is also secure because no database or backend needed.

How to build

The code below creates a static page about the University of Sydney. There are three main sections in this page.

In the first section, general section, <p> tags are used to display some general information about USYD ranking. In the second section, rank section, some blocks are created to display specific ranking of USYD. display: flex; is used to define the layout of the blocks. In the third section, table section, <div> tags are used to build a image and text block. This static page is responsive, @media screen is used to define the layout of page in three different screen sizes.

Version