BootStarp模版

時間  2019-12-17
標籤 bootstarp 模版 简体版
原文   原文鏈接

BootStarp基本模版

<!DOCTYPE html>
<html lang="zh-CN">

	<head>
		<meta charset="utf-8">
		<!--聲明文檔兼容模式，表示使用IE瀏覽器的最新模式-->
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<!--設置視口的寬度(值爲設備的理想寬度)，頁面初始縮放值<理想寬度/可見寬度>-->
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<!-- 上述3個meta標籤*必須*放在最前面，任何其餘內容都*必須*跟隨其後！ -->
		<title>Bootstrap基本模板</title>

		<!-- 引入Bootstrap核心樣式文件 -->
		<link href="../../css/bootstrap.min.css" rel="stylesheet">

		
	</head>

	<body>
		<h1>你好，世界！</h1>

		<!-- 引入jQuery核心js文件 -->
		<script src="../../js/jquery-1.11.0.min.js"></script>
		<!-- 引入BootStrap核心js文件 -->
		<script src="../../js/bootstrap.min.js"></script>
	</body>

</html>

2 完整模版

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
		<!--聲明文檔兼容模式，表示使用IE瀏覽器的最新模式-->
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<!--設置視口的寬度(值爲設備的理想寬度)，頁面初始縮放值<理想寬度/可見寬度>-->
		<!--視口的做用：在移動瀏覽器中，當頁面寬度超出設備，瀏覽器內部虛擬的一個頁面容器，會將頁面縮放到設備這麼大來展現-->	
		<!--width 	設置layout viewport  的寬度，爲一個正整數，或字符串"width-device"(表示採用設備的寬度)

			initial-scale 	設置頁面的初始縮放值，爲一個數字，能夠帶小數

			minimum-scale 	容許用戶的最小縮放值，爲一個數字，能夠帶小數

			maximum-scale 	容許用戶的最大縮放值，爲一個數字，能夠帶小數

			height 	設置layout viewport  的高度，這個屬性對咱們並不重要，不多使用

			user-scalable 	是否容許用戶進行縮放，值爲"no"或"yes", no 表明不容許，yes表明容許
			若是設置"user-scalable=no",那麼"minimum-scale"和"maximum-scale"無效
		-->
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<!-- 上述3個meta標籤*必須*放在最前面，任何其餘內容都*必須*跟隨其後！ -->
		<title>Bootstrap完整模板</title>

		<!-- 引入Bootstrap核心樣式文件 -->
		<link href="../../css/bootstrap.min.css" rel="stylesheet">

		<!-- HTML5 Shim 和 Respond.js 用於讓 IE8 支持 HTML5元素和媒體查詢 -->
      	<!-- 注意： 若是經過 file://  引入 Respond.js 文件，則該文件沒法起效果，必須放置到web服務器中，暫時沒必要掌握 -->
      <!--[if lt IE 9]>
         <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
         <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
      <![endif]-->
	</head>

	<body>
		<!--正文今後處開始-->
		<h1>你好，世界！</h1>

		<!--前端開發建議：網站優化時，除了當即須要工做的js存放在head外，將大部分JS文件放在頁面的末尾-->

		<!-- 引入jQuery核心js文件，必須放置在bootStrap.js前面！ -->
		<script src="../../js/jquery-1.11.0.min.js"></script>
		<!-- 引入BootStrap核心js文件 -->
		<script src="../../js/bootstrap.min.js"></script>
	</body>

</html>
相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程