Containers in Bootstrap - English

Play
Current Time 0:00
/
Duration Time 0:00
Remaining Time -0:00
Loaded: 0%
Progress: 0%
0:00
Fullscreen
00:00
Mute

2132 visits

  1. Instruction Sheet
  2. Installation Sheet
  3. Report Missing Component
  4. Post your Question on the Forum
Outline:
Containers in Bootstrap

What are containers?
Add .container class to the HTML file
How to set responsive design mode?
What are breakpoints?
How to set screen size to Extra Large?
Observe the width of the container in responsive design mode
Add .container-fluid class to the HTML file
Observe the width of the container-fluid in responsive design mode
Add .container-md class to the HTML file
Observe the width of the container-md in responsive design mode
Width:952 Height:710
Duration:00:11:44 Size:5.6 MB

Show video info

Pre-requisite

Introduction to Bootstrap

  Assignment

Code files

  • Containers-in-Bootstrap-Code-Files/
  • Containers-in-Bootstrap-Code-Files/Mypage.html
  • Containers-in-Bootstrap-Code-Files/MyPage.txt
  • Containers-in-Bootstrap-Code-Files/Mystyle.txt

Script

Slides

  • Containers-in-Bootstrap-Slide/
  • Containers-in-Bootstrap-Slide/Containers-in-Bootstrap.tex
  • Containers-in-Bootstrap-Slide/Containers-in-Bootstrap.pdf
  • Containers-in-Bootstrap-Slide/spoken.png
  • Containers-in-Bootstrap-Slide/table1.png
  • Containers-in-Bootstrap-Slide/table2.png
  • Containers-in-Bootstrap-Slide/table3.png
  • Containers-in-Bootstrap-Slide/table4.png