Join Ray Villalobos for an in-depth discussion in this video Creating simple column layouts, part of Bootstrap Layouts: Responsive Single-Page Design.
- So far, we've been talking about…how layout classes work in Bootstrap.…In this video, we're gonna use these principles…as we start to layout our page.…Now we've already discussed how in Bootstrap…you control layouts through three different tags.…First, the container which controls the width…of your layouts relates to the view boards,…rows which create vertical divisions in your page,…and columns which creates vertical sections of content…within rows.…Now with that in mind, let's go ahead and set up…a basic layout for our site.…I'm gonna start by getting rid of some of the layout…we've done previously.…
So I need to go right underneath the body tag…and delete this container.…Now this container has a pair all the way at the bottom…of the page, right above the script tags.…So I'll get rid of that one,…and then I'm gonna go over to the mission page,…or the mission section,…and get rid of some of this markup here.…So I need to get rid of this row.…We may end up putting some of this back in,…but we're just gonna start from scratch.…
- Analyzing your markup
- Creating simple column layouts
- Creating basic navigation and a simple carousel
- Modifying Bootstrap styles
- Working with branding and toggle styles
- Adding interactivity
Skill Level Beginner
1. Understanding Bootstrap Layouts
2. Customizing Bootstrap Styles
3. Adding Interactivity
Next steps2m 50s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.