Bootstarp基本模版学习教程

今天开始学习bootstrap发现官方的文档其实写的真的太棒啦，非常的清晰易懂。

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
  <title>Bootstrap 101 Template</title>

  <!-- Bootstrap -->
  <link href="css/bootstrap.min.css" rel="stylesheet">

  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
  <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
  <![endif]-->
</head>
<body>
<h1>你好，世界！</h1>

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
</body>
</html>

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • Bootstarp风格的toggle效果分享

    Bootstarp风格的toggle效果分享

    最近在写项目的时候想要一个这样的效果, 我知道这个效果在 flat-ui中有, 但是我又不想引用一整个flat-ui; 这个效果依赖html5的transition, 所以浏览器兼容成问题: 从flat-ui中把这个效果的js和html,以及css给拨离出来: 整体的代码如下: 运行下面代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title></ti

  • Bootstarp 基础教程之表单部分实例代码

    参考:BootStrap中的表单大全 bootstrap 表单部分,具体代码如下所示: <div class="container"> <form action="#" method="post"> <fieldset> <legend>用户登陆</legend> <div class="form-group"> <label>用户名:<

  • 基于BootStarp的Dailog

    基于BootStarp的Dailog

    BootStrip简介 Bootstrap,来自 Twitter,是目前很受欢迎的前端框架. Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷. 它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架. Bootstrap提供了优雅的HTML和CSS规范,它即是由动态CSS语言Less写成.Bootstrap一经推出后颇受欢迎,一直是GitHub上的热门开源项目,包括NASA的M

  • Bootstarp基本模版学习教程

    今天开始学习bootstrap发现官方的文档其实写的真的太棒啦,非常的清晰易懂. <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="view

  • Kotlin学习教程之函数的默认参数

    前言 ​ 在Java中,为函数的参数添加默认值是不被允许的,这是为了防止默认参数与函数重载同时使用时二义性的问题,考虑下面的例子: void func(p1: String, p2: String, p3: String = "default") { // do something } void func(String p1, String p2) { // do something } 假设上面的代码是可以编译通过的,那么当调用func("p1","p2

  • 值得分享和收藏的Bootstrap学习教程

    首先先感谢朋友们对小编的支持,关注小编的文章,和小编一起学习进步,一直的陪伴,小编也一定会再接再厉,为大家分享更多精彩的文章. 在分享的过程中遇到了一些问题,这也给了我很大的启发,大家在搜索相关文章时都没有针对此类问题进行的系统整理文章,这也是小编需要在今后进行改进的. 所以本文就吸取这个经验,针对Bootstrap教程进行系统整理,希望对大家的学习有所帮助,便于大家学习. 小编的水平能力都很有限,还望大牛多给一些建议和看法,帮助小编进行改正和提高,如果文中确有不妥之处,还请谅解.希望能和大家共

  • Java正则表达式学习教程

    Java正则表达式学习教程

    本教程旨在帮助你驾驭Java正则表达式,同时也帮助我复习正则表达式. 什么是正则表达式? 正则表达式定义了字符串的模式.正则表达式可以用来搜索.编辑或处理文本.正则表达式并不仅限于某一种语言,但是在每种语言中有细微的差别.Java正则表达式和Perl的是最为相似的. Java正则表达式的类在 java.util.regex 包中,包括三个类:Pattern,Matcher 和 PatternSyntaxException. Pattern对象是正则表达式的已编译版本.他没有任何公共构造器,我们通

  • MyBatis学习教程(六)-调用存储过程

    一.提出需求 查询得到男性或女性的数量, 如果传入的是0就女性否则是男性 二.准备数据库表和存储过程 create table p_user( id int primary key auto_increment, name varchar(), sex char() ); insert into p_user(name,sex) values('A',"男"); insert into p_user(name,sex) values('B',"女"); insert

  • MyBatis学习教程(二)—如何使用MyBatis对users表执行CRUD操作

    上一篇文章MyBatis入门学习教程(一)-MyBatis快速入门中我们讲了如何使用Mybatis查询users表中的数据,算是对MyBatis有一个初步的入门了,今天讲解一下如何使用MyBatis对users表执行CRUD操作.在没奔主题之前,先给大家补充点有关mybatis和crud的基本知识. 什么是 MyBatis? MyBatis 是支持普通 SQL 查询,存储过程和高级映射的优秀持久层框架. MyBatis 消除了几乎所有的 JDBC 代码和参数的手工设置以及对结果集的检索.MyBa

  • mybatis框架入门学习教程

    mybatis框架入门学习教程

    MyBatis是一个支持普通SQL查询,存储过程和高级映射的优秀持久层框架.MyBatis消除了几乎所有的JDBC代码和参数的手工设置以及对结果集的检索封装.MyBatis可以使用简单的XML或注解用于配置和原始映射,将接口和Java的POJO(Plain Old Java Objects,普通的Java对象)映射成数据库中的记录. 1.创建工程,导入jar包 创建一个java工程或者web工程都可以,然后导入mybatis的jar包和依赖包还有数据库的jar包,本人使用Oracle10g数据库

  • laravel学习教程之关联模型

    Eloquent: 关联模型 简介 数据库中的表经常性的关联其它的表.比如,一个博客文章可以有很多的评论,或者一个订单会关联一个用户.Eloquent 使管理和协作这些关系变的非常的容易,并且支持多种不同类型的关联:     一对一     一对多     多对多     远程一对多     多态关联     多态多对多关联 定义关联 Eloquent 关联可以像定义方法一样在 Eloquent 模型类中进行定义.同时,它就像 Eloquent 模型自身一样也提供了强大的查询生成器.这允许关联模

  • laravel学习教程之存取器

    前言 Laravel是一个简单优雅的PHP Web开发框架,可以将开发者从意大利面条式的代码中解放出来,通过简单.高雅.表达式语法开发出很棒的Web应用,那下面跟着小编一起来学习laravel中的存取器吧. Eloquent: 存取器简介 访问器和存储器允许你在获取或者设置 Eloquent 模型属性值时对其进行格式化操作.比如,你可能希望当一个值存储进数据库之前先对其进行 Laravel encrypter 进行加密操作,并且可以在你通过模型访问的时候自动的进行该属性的解密. 除了可自定义的的

  • Python装饰器入门学习教程(九步学习)

    装饰器(decorator)是一种高级Python语法.装饰器可以对一个函数.方法或者类进行加工.在Python中,我们有多种方法对函数和类进行加工,比如在Python闭包中,我们见到函数对象作为某一个函数的返回结果.相对于其它方式,装饰器语法简单,代码可读性高.因此,装饰器在Python项目中有广泛的应用. 这是在Python学习小组上介绍的内容,现学现卖.多练习是好的学习方式. 第一步:最简单的函数,准备附加额外功能 # -*- coding:gbk -*- '''示例1: 最简单的函数,表

随机推荐