Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

An example website that shows how to use Bootstrap to create a responsive website.

Notifications You must be signed in to change notification settings

JasonBraithwaite/bootstrap_yt_tutorial

Folders and files

NameName
Last commit message
Last commit date

Latest commit

History

15 Commits

Repository files navigation

bootstrap_yt_tutorial

This program is just an example of how to use Bootstrap to create web-pages.

It is there as a reference guide and example for future projects that use bootstrap.

This site is fully responsive.

This project has a Nav Bar that reduces to a hamburger menu for mobile devices.

It contains a Carousel image slider that rotates images at timed intervals. The text overlay is removed for mobile devices. This includes using a previous and next button to allow the user to rotate through the slides manually.

The site has a three column section that includes image and text that resizes to a one column for smaller screens

It has a fixed background section with a text overlay with two buttons that when pressed lead to a Modal Popup section.

This project has a Navbar collapse seen in this project as the Emoji Navbar collapse. The Navbar will open when clicked and display 4 emojis. When clicked again the navbar will collapse and hide the emojis.

The site contains a two Column and Jumbotron Section directly below it ("looking for quality web development and design services? Contact Us Today"). Note how the Contact Us Today Button has padding top when in small screen and no padding when the screen gets bigger using pt-4 pt-md-0.

Finally the project includes a footer and socket section that is centered, has a logo and further logo links to Social media.

Added media queries to resize text size in the overlay text for the carousel images at large and medium size screens

About

An example website that shows how to use Bootstrap to create a responsive website.

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published

AltStyle によって変換されたページ (->オリジナル) /