第二章使用Bootstrap的准备-HelloWorld 笔记2

最新推荐文章于 2021-12-20 19:37:37 发布

往前的

最新推荐文章于 2021-12-20 19:37:37 发布

阅读量481

点赞数

CC 4.0 BY-SA版权

分类专栏： Bootstrap实战文章标签： bootstrap helloworld 入门

本文链接：https://blog.youkuaiyun.com/m0_37355951/article/details/73743682

Bootstrap实战专栏收录该内容

17 篇文章

订阅专栏

本文通过一个简单的Hello World示例介绍了如何使用Bootstrap。从引入核心CSS和JS文件到实现基本的页面元素样式，帮助初学者快速上手。

概述：

简单了解一下bootstrap如何使用从hello world 开始

代码：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>firstBootstrap</title>
<!-- 引入核心css文件 -->
<link href="../bootstrap-3.3.7-dist/css/bootstrap.css" rel="stylesheet" type="text/css">

</head>
<body>

<h1 class="btn btn-success btn-large"><i class="glyphicon glyphicon-user" ></i> HelloWorld ！</h1>

<!-- 引入jquery.js 因为它是基于jquery -->
<script src="http://code.jquery.com/jquery.js"></script>
<!-- 引入核心js -->
<script src="../bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
</body>
</html>

效果：