bootstrap前端项目案例_突然领导让我搭前端页面，我好方，20分钟玩转Bootstrap

随着互联网的发展，人们对网页的体验度不断提升，不仅仅是满足功能需求，还要追求审美，追求好的体验度。作为一个后端，写前端好难，怎么写好前端？

什么是Bootstrap？

基于HTML、CSS、JavaScript 开发的简洁、直观、强悍的前端开发框架，使得 Web 开发更加快捷。 而且它还支持响应式布局。

Bootstrap学习路线

了解

Flat Ui

Bootstrap select2

Bootstrap datetimepicker

Bootstrap datatables

font awesome官网

熟练使用API:https://v3.bootcss.com/

全局CSS样式

组件

JavaScript插件

Bootstrap菜鸟使用步骤

进入：https://v3.bootcss.com 下载

下载后的文件

如何在项目中引用Bootstrap框架

步骤：

1、 在项目中新建一个bootstrap目录，将提前下载好的文件copy到bootstrap文件目录中来(css、fonts、js)。并且将jquery的函数库插件也copy到项目中来。

2、 页面中引入的标签及文件

接下来打开API文档跟着操作

重点关注三个模块：全局css样式、组件、JavaScript插件

全部看完，实践跟着操作。

实例代码：

    Title

data data data data data data data data data data data data data data data data data data data data

重点难点-栅格布局

一定先理解12个格子

实例代码：

    Title

-- col-xs-4 : 指小于768px的小设备

11

-- col-sm-4 ：指>=768px的设备

22

-- col-md-4 ：指>=992px设备

33

-- col-lg-4 ：值1200px设备

11

22

33

11

22

33

11

22

33

谁在最需要的时候轻轻拍着我肩膀，谁在最快乐的时候愿意和我分享。今天我的分享就到这里，大家有没有什么好的学习方法呢？欢迎来留言评论，和我们一起交流。如果喜欢我的文章，也欢迎大家关注、点赞、转发。我是丫丫，一个专注分享项目实战技能的IT从业者。