Bootstrap -- 初见 Bootstrap

Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的。

自 Bootstrap 3 起,框架包含了贯穿于整个库的移动设备优先的样式。

1. 使用方式

http://getbootstrap.com/下载 bootstrap.min.css 文件 和 bootstrap.min.js 文件。

在需要使用的页面引用下载的 css 文件和 js 文件即可。

2. 举例

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>My Test bootstrap</title>
<link rel="stylesheet" href="./css/bootstrap.min.css">
<script type="text/javascript" src="./js/bootstrap.min.js"></script>
</head>
<body>
<div class="jumbotron">
<h2>Hello, world!</h2>
<p>开始学习bootstrap</p>
</div>
</body>
</html>

3. Bootstrap 使用了一些 HTML5 元素和 CSS 属性。为了让这些正常工作,您需要使用 HTML5 文档类型(Doctype)。

  因此,请在使用 Bootstrap 项目的网页开头包含下面的代码段。

<!DOCTYPE html>

Bootstrap -- 初见 Bootstrap的更多相关文章

  1. Thymeleaf使用bootstrap及其bootstrap相关插件(一)

    Bootstrap,来自 Twitter,是目前最受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷. 在完成信息录入界面 ...

  2. [Bootstrap] install Bootstrap framework in window 7 by npm

    Install with npm You can also install Bootstrap using npm: $ npm install bootstrap require('bootstra ...

  3. MVC bootstrap 实现 bootstrap table 左右传递数据

    源码: @{ ViewBag.Title = "Index"; } @using BC.Platform.UPMS.Models; <!DOCTYPE html> &l ...

  4. 【Bootstrap】Bootstrap和Java分页-第二篇

    目录 关于此文 配置xml-pager.tld 分页控件-Pager 分页action集成类-BaseController 实例-Dao 实例-service 实例-action 实例-JSP 实例- ...

  5. 【Bootstrap】Bootstrap和Java分页-第一篇

    目录 关于此文 pagination BetweenIndex DefaultPagination QueryHandler BookDaoImpl BookServiceImpl BookActio ...

  6. 【Bootstrap】Bootstrap Datepicker使用

    插件:http://url.cn/V4S8w4 1.添加样式和引用JS文件 <link href="CSS/bootstrap-datetimepicker.css" rel ...

  7. Jquery Easyui与Jquery Bootstrap(Metronic Bootstrap)的简单比较

    1,通常来看WEB前端用 bootstrap 比较好,后台用EASYUI比较好.Easyui适合工厂企业的管理系统如ERP,CRM之类的,Bootstrap适用于多屏跨设备浏览. 简言之,一个适合上班 ...

  8. python 全栈开发,Day58(bootstrap组件,bootstrap JavaScript 插件,后台模板,图表插件,jQuery插件库,Animate.css,swiper,运行vue项目)

    一.bootstrap组件 无数可复用的组件,包括字体图标.下拉菜单.导航.警告框.弹出框等更多功能. 组件和插件的区别? 插件:一个功能,比如js文件 组件:html css js 组件包含插件 面 ...

  9. Bootstrap之Bootstrap组件

    一 文本居中 col-xx-offset-xx:水平居中 center-block:使用于不涉及float标签的水平居中,也不涉及列的居中,让哪里居中就写到哪里,本质是:margin:0 auto. ...

随机推荐

  1. ThinkPHP 数据库操作(三) : 查询方法、查询语法、链式操作

    查询方法 条件查询方法 where 方法 可以使用 where 方法进行 AND 条件查询: Db::table('think_user') ->where('name','like','%th ...

  2. "人机"对战:电脑太简单了,我是射手 skr~skr~skr

    9月17日,2018 世界人工智能大会在上海拉开帷幕.在 SAIL 榜单入围项目中,我看到了小爱同学.小马智行.微软小冰.腾讯觅影等等,这不仅让我大开了眼界,也不禁让我感慨 AI 的发展神速.犹记得去 ...

  3. Can't connect to X11 window server using ':1.0' as the value of the DISPLAY variable.

    安装oracle数据时需要用到图形界面安装,当我们用root用户登录后切换到oracle用户时运行./runInstaller提示报错: Can't connect to X11 window ser ...

  4. log4cplus使用(二)-自定义日志等级

    log4cplus支持用户自定义日志等级,操作也比较简单,使用之前贴如下宏定义 #define LOG4CPLUS_MACRO_CREASH_LOG_LEVEL(pred) LOG4CPLUS_UNL ...

  5. Android app 架构的一些讨论和资源收藏

    架构 https://www.zhihu.com/question/21406685 MVP,MVC,MVVM框架 http://blog.csdn.net/copy_yuan/article/det ...

  6. JavaScript面向对象--多态

    一.多态的概念 相同的函数作用于不同的对象,会得到不同的结果,这就是多态. 二.如果不用多态,会怎么样? 这里有个浅显易懂的例子,定义一个函数叫makeSound,传入不同的对象,函数体里要写不同的情 ...

  7. Chapter 5 Blood Type——8

    He chuckled. "What are your plans?" 他窃笑道.“那你的计划是什么?” I blushed. I had been vacillating dur ...

  8. ThreadPoolExecutor系列二——ThreadPoolExecutor 代码流程图

    ThreadPoolExecutor 代码流程图 本文系作者原创,转载请注明出处:http://www.cnblogs.com/further-further-further/p/7681648.ht ...

  9. protobuf、LRU、sigleflight

    今天咱一次讲3个吧,赶一下进度,好早点开始聊kubernetes! 从groupcache的项目目录结构看,我们今天要学习groupcachepb.lru.singleflight这3个package ...

  10. 痞子衡嵌入式:飞思卡尔Kinetis系列MCU启动那些事(1)- KBOOT架构

    大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是飞思卡尔Kinetis系列MCU的KBOOT架构. Bootloader是嵌入式MCU开发里很常见的一种专用的应用程序,在一个没有Boo ...