Resolve one line error for Responsive Web Page
- Country :
India
Design a web page that should contain Bootstrap's responsive navigation bar, responsive circle image, and responsive footer.Concepts Covered: Bootstrap-4's responsive navigation bar and responsive circle images
Use thhe snapshots of the web page as:
- Image 1: Web page in large devices
- Image 2: Web page in small devices:
Key Points:
1. Add responsive features to the navigation bar. The collapsing nature is tripped by a button with the id 'btn-id' belongs to Bootstrap-4 navbar-toggler class and then features two data elements: data-toggle with 'collapse' value and data-target. Set appropriate value for data-target attribute.
2. Inside the above-mentioned button tag, create a span tag with Bootstrap-4 class 'navbar-toggler-icon' for creating a toggler-icon with three bars (hamburger button).
3. Use Bootstrap-4 classes img-responsive and rounded-circle to make the image responsive, so that, it can automatically adjust to fit the size of the screen.
