Answered step by step
Verified Expert Solution
Question
1 Approved Answer
Task1: Style your web pages according to the following requirements: [22 points] For the main page (index.html), style your document according to the following specification.
Task1: Style your web pages according to the following requirements: [22 points]
- For the main page (index.html), style your document according to the following specification.
- Apply Bootstraps Jumbotron to your heading, i.e. your name and one sentence that describes who you are.
- Apply Bootstraps navbar and/or nav to the navigation list that links to other pages. Make the current menu item for the current page active. Fix the navigation bar to always stay at the top of the page.
- Style your favorite quote with any appropriate class, e.g. blockquote.
- Modify your footer section to also include links to your social media accounts, e.g. fb, LinkedIn, twitter etc. Then apply Bootstraps page-footer to the footer element.
- Apply a 2-column layout to your image and the about me section only when the screen size is 992px or higher.
- For the My Skill page, style your document according to the following specification.
- Apply Bootstraps navbar to the navigation list that links to other pages. Make the current menu item for the current page active. Fix the navigation bar to always stay at the top of the page.
- Apply a 2-column layout to your technical and the non-technical skills only when the screen size is 992px or higher.
- For Courses Completed page, style your document according to the following specification.
- Apply Bootstraps navbar to the navigation list that links to other pages. Make the current menu item for the current page active. Fix the navigation bar to always stay at the top of the page.
- Apply table class to your table, add zebra-striping to the table row, make the background color of the
different from other rows. Also enable hover state on table rows. - Make the image on the page to float next to the table (either on the left or right side) when the screen size is 992px or higher.
- For My Gallery page, style your document according to the following specification.
- Choose to style your page with either image thumbnails or carousel. The images need to be responsive images, i.e. they should scale with the parent element.
- Create an additional CSS external style sheet. Modify style for at least one ID selector and at least one class selector. This needs to override the Bootstraps style.
Task1: Style your web pages according to the following requirements: [22 points]
- For the main page (index.html), style your document according to the following specification.
- Apply Bootstraps Jumbotron to your heading, i.e. your name and one sentence that describes who you are.
- Apply Bootstraps navbar and/or nav to the navigation list that links to other pages. Make the current menu item for the current page active. Fix the navigation bar to always stay at the top of the page.
- Style your favorite quote with any appropriate class, e.g. blockquote.
- Modify your footer section to also include links to your social media accounts, e.g. fb, LinkedIn, twitter etc. Then apply Bootstraps page-footer to the footer element.
- Apply a 2-column layout to your image and the about me section only when the screen size is 992px or higher.
- For the My Skill page, style your document according to the following specification.
- Apply Bootstraps navbar to the navigation list that links to other pages. Make the current menu item for the current page active. Fix the navigation bar to always stay at the top of the page.
- Apply a 2-column layout to your technical and the non-technical skills only when the screen size is 992px or higher.
- For Courses Completed page, style your document according to the following specification.
- Apply Bootstraps navbar to the navigation list that links to other pages. Make the current menu item for the current page active. Fix the navigation bar to always stay at the top of the page.
- Apply table class to your table, add zebra-striping to the table row, make the background color of the
different from other rows. Also enable hover state on table rows. - Make the image on the page to float next to the table (either on the left or right side) when the screen size is 992px or higher.
- For My Gallery page, style your document according to the following specification.
- Choose to style your page with either image thumbnails or carousel. The images need to be responsive images, i.e. they should scale with the parent element.
- Create an additional CSS external style sheet. Modify style for at least one ID selector and at least one class selector. This needs to override the Bootstraps style.
Step by Step Solution
There are 3 Steps involved in it
Step: 1
Get Instant Access to Expert-Tailored Solutions
See step-by-step solutions with expert insights and AI powered tools for academic success
Step: 2
Step: 3
Ace Your Homework with AI
Get the answers you need in no time with our AI-driven, step-by-step assistance
Get Started