目录

Bootstrap - 教程

Twitter Bootstrap是最近最流行的前端框架。 它是时尚,直观且功能强大的移动第一前端框架,可实现更快速,更轻松的Web开发。 它使用HTML,CSS和Javascript。 本教程将向您介绍Bootstrap Framework的基础知识,您可以使用它轻松创建Web项目。 本教程分为Bootstrap Basic Structure,Bootstrap CSS,Bootstrap Layout Components和Bootstrap Plugins等部分。 这些部分中的每一部分都包含相关主题和简单实用的示例。

听众 (Audience)

本教程是为具有HTML和CSS基础知识且有开发网站需求的人准备的。 完成本教程后,您将发现自己具有使用Twitter Bootstrap开发Web项目的中等专业水平。

先决条件 (Prerequisites)

在开始继续本教程之前,我们假设您已经了解HTML和CSS的基础知识。 如果您不太了解这些概念,我们建议您阅读我们关于HTML Tutorial和CSS Tutorial的简短教程。

Execute Bootstrap Online

您不需要拥有自己的环境来开始学习Bootstrap编程! 我们为您设置了一个在线编译器,可用于在线编译和执行程序。

对于本教程中提供的大多数示例,您将在代码框的右上角找到“试用”选项。 使用它来验证程序并使用不同的选项检查结果。 随意修改任何示例并在线执行。

<!DOCTYPE html>
<html lang = "en">
   <head>
      <meta charset = "utf-8">
      <meta http-equiv = "X-UA-Compatible" content = "IE = edge">
      <meta name = "viewport" content = "width = device-width, initial-scale = 1">
      <title>Bootstrap 101 Template</title>
      <!-- Bootstrap -->
      <link href = "//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/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://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src = "https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
      <![endif]-->
   </head>
   <body>
      <h1>Hello, world!</h1>
      <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
      <script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
      <!-- Include all compiled plugins (below), or include individual files as needed -->
      <script src = "//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
   </body>
</html>
<上一篇.Bootstrap - 教程
Bootstrap - 概述.下一篇>
↑回到顶部↑
WIKI教程 @2018