Bootstrap responsive web layout-Free online video tutorial-php.cn

Community Learn Tools Library Leisure

English

Bootstrap responsive web layout

This Bootstrap tutorial explains how to apply responsive design to web layouts. In the course, you'll learn about responsive web design. With the popularity of mobile devices, how to allow users to browse your website through mobile devices to obtain good visual effects has become an inevitable problem. Responsive web design is an effective way to achieve this.

Elementary

bootstrap responsive web layout

191277 person learning

71class hour

03 hours 43 minutes 25 secondsTotal course duration

2023-05-22update

-

Gold lecturer

A total of 43 courses Student53536 Lecturer rating5.4

More>>

Course Introduction Course Outline Data Download Other Courses

You will learn：

This tutorial explains how to apply responsive design to web layouts. In the course, you'll learn about responsive web design. With the popularity of mobile devices, how to allow users to browse your website through mobile devices to obtain good visual effects has become an inevitable problem. Responsive web design is an effective way to achieve this.

Bootstrap responsive web layout

Chapter1 Bootstrap. User interface architecture
expand retract

Section1 User interface and interaction architecture
duration： 01 minutes 44 seconds

Section2 Download Bootstrap
duration： 02 minutes 15 seconds

Section3 Included files
duration： 02 minutes 26 seconds

Section4 Using Bootstrap in web pages
duration： 05 minutes 34 seconds

Section5 layout
duration： 04 minutes 34 seconds

Section6 Nested layout and flowing layout
duration： 03 minutes 50 seconds

Section7 Responsive layout
duration： 04 minutes 21 seconds

Section8 Convert existing fixed-width layout to responsive layout
duration： 03 minutes 38 seconds

Section9 Utility classes for responsive layouts
duration： 02 minutes 59 seconds

Section10 Common tags and styles
duration： 03 minutes 48 seconds

Section11 list
duration： 03 minutes 30 seconds

Section12 code
duration： 03 minutes 44 seconds

Section13 Google Prettify
duration： 02 minutes 29 seconds

Section14 sheet
duration： 03 minutes 24 seconds

Section15 form
duration： 04 minutes 09 seconds

Section16 Prefixes and suffixes of text boxes
duration： 03 minutes 14 seconds

Section17 single button
duration： 02 minutes 16 seconds

Section18 checkbox
duration： 02 minutes 17 seconds

Section19 select list
duration： 02 minutes 42 seconds

Section20 Form layout
duration： 02 minutes 53 seconds

Section21 button
duration： 03 minutes 55 seconds

Section22 button group
duration： 02 minutes 13 seconds

Section23 button with dropdown menu
duration： 03 minutes 48 seconds

Section24 Navigation menu
duration： 05 minutes 43 seconds

Section25 Drop-down menu in navigation menu
duration： 02 minutes 07 seconds

Section26 Responsive design of navigation menu
duration： 02 minutes 35 seconds

Section27 Tab #1
duration： 02 minutes 42 seconds

Section28 Tab #2
duration： 03 minutes 58 seconds

Section29 Navigation paths and paginators
duration： 04 minutes 01 seconds

Section30 Prompt message
duration： 02 minutes 43 seconds

Section31 thumbnail
duration： 03 minutes 58 seconds

Section32 dialog box
duration： 04 minutes 01 seconds

Section33 tooltip
duration： 03 minutes 26 seconds

Section34 Collapse content
duration： 04 minutes 45 seconds

Section35 carousel
duration： 03 minutes 39 seconds
Chapter2 Responsive web design
expand retract

Section1 Course Introduction
duration： 01 minutes 39 seconds

Section2 Real-life examples of responsive design
duration： 02 minutes 33 seconds

Section3 viewport - viewport
duration： 01 minutes 33 seconds

Section4 Manually configure viewport
duration： 04 minutes 25 seconds

Section5 Pixel density
duration： 02 minutes 49 seconds

Section6 How to apply media queries
duration： 01 minutes 53 seconds

Section7 media type media type
duration： 04 minutes 00 seconds

Section8 meida feature media feature
duration： 01 minutes 43 seconds

Section9 aspect-ratio ratio of visual window width to height
duration： 03 minutes 01 seconds

Section10 aspect-ratio The ratio of the width to height of the device
duration： 03 minutes 34 seconds

Section11 orientation The direction of use of the device
duration： 02 minutes 04 seconds

Section12 height (visual window height) and device-height (device height)
duration： 03 minutes 20 seconds

Section13 width (visual window width) and device-width (device width)
duration： 03 minutes 45 seconds

Section14 resolution pixel density
duration： 05 minutes 09 seconds

Section15 Operator - and
duration： 04 minutes 33 seconds

Section16 Join multiple media queries separated by commas
duration： 02 minutes 13 seconds

Section17 Operator - not
duration： 03 minutes 03 seconds

Section18 Responsive layout #1
duration： 03 minutes 56 seconds

Section19 Responsive layout #2
duration： 02 minutes 05 seconds

Section20 Responsive layout #3
duration： 02 minutes 07 seconds

Section21 Responsive navigation
duration： 01 minutes 52 seconds

Section22 HTML for navigation menu
duration： 04 minutes 07 seconds

Section23 CSS for navigation menu
duration： 02 minutes 46 seconds

Section24 Toggle button style
duration： 03 minutes 08 seconds

Section25 Responsive navigation menu styles
duration： 04 minutes 06 seconds

Section26 Responsive images
duration： 04 minutes 07 seconds

Section27 Responsive background images
duration： 01 minutes 43 seconds

Section28 Different sizes of devices use different images
duration： 00 minutes 49 seconds

Section29 Use different background images for different size devices
duration： 03 minutes 05 seconds

Section30 Switch different background images based on screen density
duration： 03 minutes 14 seconds

Section31 picturefill
duration： 04 minutes 40 seconds

Section32 Responsive slideshow
duration： 03 minutes 50 seconds

Section33 Slide control buttons
duration： 02 minutes 08 seconds

Section34 Slide control button style
duration： 03 minutes 06 seconds

Section35 Fix the issue of slides being overwritten
duration： 01 minutes 27 seconds

Section36 Conclusion
duration： 00 minutes 31 seconds

Data Name operate
[must see]Bootstrap responsive web layout Download

[must see]Bootstrap responsive web layout Download

- Lecturer Other Courses

ElementaryHTML front-end basics Part 6

344481
Collection
IntermediateHTML5 development practice: front-end production of Baidu takeout mobile website

65509
Collection
ElementaryFrom scratch to WEB responsive layout

163237
Collection
ElementaryGet started quickly with HTML5

55565
Collection
ElementaryGet started quickly with CSS3

79393
Collection
Intermediatetouch video tutorial

83472
Collection
IntermediateWeb front-end development hybrid development video tutorial

31164
Collection
IntermediateHTML5 Canvas animation practical tutorial

58244
Collection
Elementarybootstrap3 series (English) + Twitter Bootstrap101 series

48537
Collection
ElementaryBrothers Zhang Cheng UI tutorial Bootstrap video tutorial

44364
Collection
ElementaryBacking Network BootStrap video tutorial

43472
Collection
ElementaryBootstrap responsive web layout

191277
Collection

Start Learning

This course includes：

03 hours 43 minutes 25 seconds Watch videos anytime

2 Download Resources

Popular courses Latest courses

More>