Bootstrap介绍：　　

Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目。

Bootstrap的特点：

　一、预处理脚本:虽然可以直接使用 Bootstrap 提供的 CSS 样式表，不要忘记 Bootstrap 的源码是基于最流行的 CSS 预处理脚本 - Less 和 Sass 开发的。你可以采用预编译的 CSS 文件快速开发，也可以从源码定制自己需要的样式。

　二、一个框架、多种设备:你的网站和应用能在 Bootstrap 的帮助下通过同一份代码快速、有效适配手机、平板、PC 设备，这一切都是 CSS 媒体查询（Media Query）的功劳。

　三、特性齐全，Bootstrap 提供了全面、美观的文档。你能在这里找到关于 HTML 元素、HTML 和 CSS 组件、jQuery 插件方面的所有详细文档。

准备工作：

　　　下载Bootstrap，中文站地址:http://v3.bootcss.com/

　　下载jQuery,地址为http://jquery.com/download/

下载生产版（压缩版）或开发版（未压缩版）

　　　

　　　网页中使用bootstrap,引入bootstrap与jquery相关文件，至少3个。

使用bootstrap编写漂亮的界面，建议从Bootstrap全局CSS样式然后到Bootstrap组件最后Bootstrap JavaScript插件的顺序学习。

以下是一个简单的页面，使用bootstrap css美化了我们的页面；效果是不是比我们程序员写的页面漂亮的许多

教你用Bootstrap开发漂亮的前端界面的更多相关文章

  1. 【连载】Bootstrap开发漂亮的前端界面之插件开发

    相关文章: 1.<教你用Bootstrap开发漂亮的前端界面> 2.<Bootstrap开发漂亮的前端界面之实现原理> 3.<Bootstrap开发漂亮的前端界面之自定义 ...

  2. 【连载】Bootstrap开发漂亮的前端界面之自定义右键菜单

    连载: 1<教你用Bootstrap开发漂亮的前端界面> 2.<Bootstrap开发漂亮的前端界面之实现原理> 网页中的自定义右键菜单越来越普遍,自定义右键菜单可以增强用户体 ...

  3. Bootstrap开发漂亮的前端界面之实现原理

    引:Bootstrap采用的是一个“响应式”设计.响应式Web 设计是一个让用户通过各种尺寸的设备浏览网站获得良好的视觉效果的方法.例如,您先在计算机显示器上浏览一个网站,然后再智能手机上浏览,智能手 ...

  4. 推荐一款基于bootstrap的漂亮的前端模板—inspinia_admin

    首先给出Demo网址:http://cn.inspinia.cn inspinia admin 最新版 bootstrap 完全响应式后台管理模板,采用扁平化设计.使用Bootstrap 3+ Fra ...

  5. 推荐15款最好的 Twitter Bootstrap 开发工具

    Twitter Bootstrap 自从2011年最初发布到网上后,迅速成为 Web 领域最流行的响应式前端开发框架之一,是网页设计的优秀实践.Twitter Bootstrap 框架包含了众多的预定 ...

  6. Bootstrap——优秀的开源前端框架

    Bootstrap是著名的社交网站.微博的先驱Twitter在2011年8月推出的开源WEB前端框架,集合CSS和HTML,使用了最新的浏览器技术,为快速WEB开发提供了一套前端工具包,包括布局.网格 ...

  7. iOS开发如何学习前端(1)

    iOS开发如何学习前端(1) 我为何学前端?因为无聊. 概念 前端大概三大块. HTML CSS JavaScript 基本上每个概念在iOS中都有对应的.HTML请想象成只能拉Autolayout或 ...

  8. Bootstrap开发

    1.BootStrap开发工具 任意前端工具 专门Bootstrap工具:Jetstrap(下载地址:jetstrap.com) 2.官网: www.bootcss.com(“下载Bootstrap” ...

  9. 基于bootstrap的漂亮网站后台管理界面框架汇总

    基于bootstrap的漂亮网站后台管理界面框架汇总 10个最新的 Bootstrap 3 管理模板 这里分享的 10 个模板是从最新的 Bootstrap 3 管理模板集合中挑选出来的,可以帮助你用 ...

随机推荐

  1. IDE设置jdk和maven

    File->settings->Project Structure-ProjectFile->settings->Build,Execution,Deployment-> ...

  2. 手机验证码免费10条\java、C#、html....

    使用互亿无线短信接口网址:http://www.ihuyi.com/. 首先第一步,进行注册 第二步:注册成功后进来的页面 第三步:实名认证 第四步:个人信息 等待认证成功后才能继续操作 第五步:进行 ...

  3. 在body中的AngularJS模块

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  4. ProjectOnline同步数据到线下

    根据微软官方文档 我们能将office365上的应用系统projectonline数据同步到线下. 我们看看projectonline上面的数据: 同步后到达sqlserver的数据 这样office ...

  5. 《深入理解Spring Cloud与微服务构建》书籍目录

    转载请标明出处: https://blog.csdn.net/forezp/article/details/79735542 本文出自方志朋的博客 作者简介 方志朋,毕业于武汉理工大学,CSDN博客专 ...

  6. SpringBoot非官方教程 | 第一篇：构建第一个SpringBoot工程

    转载请标明出处: https://www.fangzhipeng.com/springboot/2017/07/11/springboot1 本文出自方志朋的博客 简介 spring boot 它的设 ...

  7. oracle 的分页查询与mysql 的分页查询

    oracle 的分页查询: select * from (select o.*,rownum rn  from Persons o) where rn >40 and rn <=60 : ...

  8. swift计算label动态宽度和高度

    swift计算label动态宽度和高度 func getLabHeigh(labelStr:String,font:UIFont,width:CGFloat) -> CGFloat { let ...

  9. TCP三次挥手四次握手

    三次握手: 客户端发起: 1.向服务器端发送报文SYN=1,ACK=0;客户端进入SYN-SEND状态. 2.服务端收到SYN=1,ACK=0的请求报文,向客户端返回确认报文SYN=1,ACK=1,服 ...

  10. react中图片校验码实现以及new Buffer()使用方法

    图片校验码原理就是图片是后端生成的前端只是前后端传过来的数据流做些处理展示即可,先直接上核心代码图: 这里就是简单得对axios的一些默认项属性重写:最后你只需要将resolve的内容插入页面的< ...