Purpose: In this homework 4, you will develop a webpage using Bootstrap framework styles that is similar to
When developing your own webpage, you can just copy and paste the coding of each selected component while opening the bootstrapDemo.html file in NotePad.
Goals: To do this project, you will achieve the following goals:
Get familiar with some of the basic Bootstrap classes,
container classes: “jumbotron” “container”, “container-fluid”, “container-sm”, “container-sm”, “container-md”, “container-lg”, “container-xl”, “container-xxl”
grid basic: “col-“, “col-sm-“, “col-md-“, “col-lg-“, “col-xl-“, “col-xxl-“.
color related classes: propertyName-color, where
propertyName can be “bg”, “text”, “alert”, “btn”, “btn-outline”, and
color can be “primary”, “secondary”, “info”, “success”, “warning”, “danger”, “white”, “dark”, “light”
variety of templates (demos from1 to 74 in the file bootstrapDemo.html.
create a webpage that has a consistent style overall the page with regard to typography (font, font color, font size, font family) and layout.
Steps:
For hw4, you will only submit one file. So create a file, named as “hw4.html”.
Copy and paste the following into your hw4.html. The other link is the Bootstrap style file. Two script links are for Bootstrap style too. They are JavaScript files so that your clicks on Bootstrap styled elements work properly.
Design a new webpage with the philosophy that the webpage is a stack of containers
you will have a pile of containers from top to bottom.
Each container has several rows, and each row has up to 12 columns.
Actual html contents will be placed inside a column.
You can browse the bootstrapDemo.html for templates of each container in your design. Open it in edit and locate the demo number where you can copy and paste into your webpage.
You must provide meaningful contents, since the layout and styles are a copy-paste task.
Last Completed Projects
| topic title | academic level | Writer | delivered |
|---|