004--IDEA使用BootStrap网格

1、写在前面

项目中有时候需要使用一些简单的FORM表单或者其他页面,总是不能快速的进行生成,刚好好久没有劫持到前端的学习了,在此记录学习过程


2、核心操作

  • 编写BootStrap网格demo
  • 编写BootStrap使用媒体查询【当前文件可以直接拷贝,然后运行,不需要下载BootStrap依赖】

3、操作步骤

3.1、编写BootStrap网格demo




    Bootstrap 模板
    
    
    
    
    

    
    
    


Hello, world!

我的第一个 Bootstrap 页面

重置浏览器大小查看效果!

第一列

菜鸟教程

学的不仅是技术,更是梦想!!!

第二列

菜鸟教程..

学的不仅是技术,更是梦想!!!

第三列

菜鸟教程..

学的不仅是技术,更是梦想!!!


3.2、编写BootStrap使用媒体查询




    Bootstrap 模板
    
    
    
    
    

    
    
    

    


Hello, world!

我的第一个 Bootstrap 页面

重置浏览器大小查看效果!

进行自定义div展示,使用【媒体查询功能】,屏幕小于780时,边框变成黑色

你可能感兴趣的:(004--IDEA使用BootStrap网格)