您的位置：首页 > Web前端 > BootStrap

对于Bootstrap的介绍以及如何使用

2017-04-28 17:33 453 查看
Bootstrap是HTML、CSS和JS框架，用于开发响应式布局、移动设备优先的WEB项目。

可以自动适配任何设备，解决了响应式实现的繁琐问题，可以修改其中的各种样式，同样，其内部功能的强大包含了整个HTML，CSS，JS的各个方面。

通过Bootstrap制作的网站，极大地节省了代码，而且网页的整洁度有明显提高，熟练掌握使用可以更快更好的完成网站的制作。
http://v3.bootcss.com/getting-started/这是Bootstrap3.3.7的下载地址
如何使用：


如上，如果要插入自己的css文件，要将自己的css文件插入在

之后



JS文件则必须将JQuery文件放在Bootstrap文件之前，否则运行会出错。



在head中要记住写入这段代码，虽然是注释体，但是会生效：第一个js让ie8能支持HTML5的新标签
　　　　　　　　　　　　　　　　　　　　第二个js让ie8能支持CSS3媒体查询

那么到底如何在代码中应用，需要从Bootstrap的官方网站了解各个样式的组名
Bootstrap是通过不同的组名来判别各个标签应有哪种效果




例如一个table上有了这些class，那么出现的table样式为：

而不是传统的table样式

通过对每个标签不同的分组，可以实现各种不同的效果，并不需要css样式或js的设置改动，只需要在自己的css文件中改变需要的文字样式或颜色等即可快速做出框架网站。


栅格系统是Bootstrap制作响应式的重要系统，通过使用栅格，可以快速的完成响应式




栅格系统有这几种宽度适配，具体应用为：



表现出的效果为：全屏



宽度逐步减少：



宽度再次减少：



变为一列显示的效果。栅格系统熟练应用，可以使响应式布局迅速完成，只需在内部设置好相应的内容即可。


                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航