Description
Create below page layout by using HTML5, CSS and Bootstrap (v4.5).
1. You will use same HTML code from PW1 as your starter code and add more details and elements to create above page layout.
2. Page layout should be same (except you will align search bar and submit button to the right in Navbar) but you can change colors based on your own preference.
https://www.canva.com/learn/website-color-schemes/
3. For pictures on the page, use images.zip folder. Unzip the file and save “images” folder under the same directory with your html file. Retain same folder structure and file names and use relative paths for defining image sources.
4. Your page will not be tested on Microsoft Internet Explorer or other browsers that do not comply with the web standards. It will be only tested on latest versions of Google Chrome.
5. For full credit, your pages must pass the W3C HTML validator with no errors (a green bar). Choose appropriate HTML tags to match the structure of the content on the page. Do not express style information in HTML with inline styles or presentational HTML tags such as b or font. Use following site for validation of your pages:
http://validator.w3.org/
Resources
https://getbootstrap.com/docs/4.5/layout/grid/
https://getbootstrap.com/docs/4.5/components/alerts/
https://icons.getbootstrap.com/
Testing
Be sure to test by increasing/decreasing the size of the browser window. If you shrink the browser window sufficiently it should use the built-in Bootstrap media queries to adapt nicely to the smaller window size.
Deliverables
Your index.html file and css file (if you need your own css rules, use external css and define file location by using a relative path)
Screenshot of your page results for different device sizes (small, medium, large)
Zip all files into “yournetid_HW1.zip” and submit on eLearning.