Name: Bootstrap responsive web layout
Uploaded: 2022-04-14T14:56:29+8:00
Duration: 223 min 25 s
Description: 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.

Chapter1Bootstrap. User interface architecture: User interface and interaction architecture
01 minutes44 seconds; Download Bootstrap
02 minutes15 seconds; Included files
02 minutes26 seconds; Using Bootstrap in web pages
05 minutes34 seconds; layout
04 minutes34 seconds; Nested layout and flowing layout
03 minutes50 seconds; Responsive layout
04 minutes21 seconds; Convert existing fixed-width layout to responsive layout
03 minutes38 seconds; Utility classes for responsive layouts
02 minutes59 seconds; Common tags and styles
03 minutes48 seconds; list
03 minutes30 seconds; code
03 minutes44 seconds; Google Prettify
02 minutes29 seconds; sheet
03 minutes24 seconds; form
04 minutes09 seconds; Prefixes and suffixes of text boxes
03 minutes14 seconds; single button
02 minutes16 seconds; checkbox
02 minutes17 seconds; select list
02 minutes42 seconds; Form layout
02 minutes53 seconds; button
03 minutes55 seconds; button group
02 minutes13 seconds; button with dropdown menu
03 minutes48 seconds; Navigation menu
05 minutes43 seconds; Drop-down menu in navigation menu
02 minutes07 seconds; Responsive design of navigation menu
02 minutes35 seconds; Tab #1
02 minutes42 seconds; Tab #2
03 minutes58 seconds; Navigation paths and paginators
04 minutes01 seconds; Prompt message
02 minutes43 seconds; thumbnail
03 minutes58 seconds; dialog box
04 minutes01 seconds; tooltip
03 minutes26 seconds; Collapse content
04 minutes45 seconds; carousel
03 minutes39 seconds
Chapter2Responsive web design: Course Introduction
01 minutes39 seconds; Real-life examples of responsive design
02 minutes33 seconds; viewport - viewport
01 minutes33 seconds; Manually configure viewport
04 minutes25 seconds; Pixel density
02 minutes49 seconds; How to apply media queries
01 minutes53 seconds; media type media type
04 minutes00 seconds; meida feature media feature
01 minutes43 seconds; aspect-ratio ratio of visual window width to height
03 minutes01 seconds; aspect-ratio The ratio of the width to height of the device
03 minutes34 seconds; orientation The direction of use of the device
02 minutes04 seconds; height (visual window height) and device-height (device height)
03 minutes20 seconds; width (visual window width) and device-width (device width)
03 minutes45 seconds; resolution pixel density
05 minutes09 seconds; Operator - and
04 minutes33 seconds; Join multiple media queries separated by commas
02 minutes13 seconds; Operator - not
03 minutes03 seconds; Responsive layout #1
03 minutes56 seconds; Responsive layout #2
02 minutes05 seconds; Responsive layout #3
02 minutes07 seconds; Responsive navigation
01 minutes52 seconds; HTML for navigation menu
04 minutes07 seconds; CSS for navigation menu
02 minutes46 seconds; Toggle button style
03 minutes08 seconds; Responsive navigation menu styles
04 minutes06 seconds; Responsive images
04 minutes07 seconds; Responsive background images
01 minutes43 seconds; Different sizes of devices use different images
00 minutes49 seconds; Use different background images for different size devices
03 minutes05 seconds; Switch different background images based on screen density
03 minutes14 seconds; picturefill
04 minutes40 seconds; Responsive slideshow
03 minutes50 seconds; Slide control buttons
02 minutes08 seconds; Slide control button style
03 minutes06 seconds; Fix the issue of slides being overwritten
01 minutes27 seconds; Conclusion
00 minutes31 seconds

Bootstrap responsive web layout

About Instructor

php.cn