html 基本模板 初始程式碼 bootstrap
Bootstrap 是當下最流行的前端框架(介面工具集)。 是一個用於快速開發 Web 應用程式和網站的前端框架。用於開發響應式佈局、移動裝置優先的 WEB 專案。
<!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.0,maximum-scale=1.0,user-scalable=no">
<!-- 上述3個meta標籤*必須*放在最前面,任何其他內容都*必須*跟隨其後! -->
<title>Bootstrap 101 Template</title>
<!-- Bootstrap -->
<link href="https://cdn.jsdelivr.net/npm/ [email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- HTML5 shim 和 Respond.js 是為了讓 IE8 支援 HTML5 元素和媒體查詢(media queries)功能 -->
<!-- 警告:通過 file:// 協議(就是直接將 html 頁面拖拽到瀏覽器中)訪問頁面時 Respond.js 不起作用 -->
<!--[if lt IE 9]>
<script src="https://cdn.jsdelivr.net/npm/ [email protected]/dist/html5shiv.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dest/respond.min.js"></script>
<![endif]-->
<!-- jQuery (Bootstrap 的所有 JavaScript 外掛都依賴 jQuery,所以必須放在前邊) -->
<script src="https://cdn.jsdelivr.net/npm/ [email protected]/dist/jquery.min.js"></script>
<!-- 載入 Bootstrap 的所有 JavaScript 外掛。你也可以根據需要只加載單個外掛。 -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>
</head>
<body>
<h1>你好,世界!</h1>
</body>
</html>
螢幕適配
為了讓 Bootstrap 開發的網站對移動裝置友好,確保適當的繪製和觸屏縮放,需要在網頁的 head 之中新增 viewport meta 標籤,如下所示:
<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
width 屬性控制裝置的寬度。假設您的網站將被帶有不同螢幕解析度的裝置瀏覽,那麼將它設定為 device-width 可以確保它能正確呈現在不同裝置上。
initial-scale=1.0 確保網頁載入時,以 1:1 的比例呈現,不會有任何的縮放。
在移動裝置瀏覽器上,通過為 viewport meta 標籤新增 user-scalable=no 可以禁用其縮放(zooming)功能。
通常情況下,maximum-scale=1.0 與 user-scalable=no 一起使用。這樣禁用縮放功能後,使用者只能滾動螢幕,就能讓您的網站看上去更像原生應用的感覺。
相關推薦
html 基本模板 初始程式碼 bootstrap
Bootstrap 是當下最流行的前端框架(介面工具集)。 是一個用於快速開發 Web 應用程式和網站的前端框架。用於開發響應式佈局、移動裝置優先的 WEB 專案。 <!DOCTYPE html> <html lang="zh-CN"> <
HTML頁面模板程式碼
作者宣告:本部落格中所寫的文章,都是博主自學過程的筆記,參考了很多的學習資料,學習資料和筆記會註明出處,所有的內容都以交流學習為主。有不正確的地方,歡迎批評指正 HTML頁面模板程式碼 常用的頁面模板 <!DOCTYPE html> <html lang="en"
【BootStrap】Bootstrap簡介、環境安裝與基本模板
BootStrap簡介 什麼是BootStrap 它由Twitter的設計師Mark Otto和Jacob Thornton合作開發。 基於 HTML、CSS、JAVASCRIPT。 主要是前端的框架(HTML、CSS、JS)。 (使用Bo
HTML基本結構、頭部、註釋
現象 asc 主體 修改 描述 註意 utf-8 外部 基本 基本結構 1.HTML基本結構 <html> <head> <meta charset="utf-8"> <title
Html基本標簽與案例
center size ctype round ron http 更強 作文 12px 1.html與css的關系 2.程序 1 <!DOCTYPE HTML> 2 <html> 3 <head> 4
html基本標簽與屬性
格式 參數 換行 nbsp 禁止 文本輸入框 ide ont 改變 域名:就是一個網站的網址(和域名相對應的是IP地址) 參數:訪問某個網站的時候你想要什麽樣的數據-就要通過參數的形式告訴這個網站,然後網站就會根據你給他的參數給你返回不同的內容 協議:http 超文本傳
HTML基本標簽
原則 不變 pass 關聯 round username enc nor 教育 1、01-HTML基本標簽的head部分.html <!DOCTYPE html><!-- 文檔類型聲明:讓瀏覽器,按照html5的標準對代碼進行解釋與執行。 文檔類型聲明必不
《Flask web開發》筆記2:模板---繼承、bootstrap
only world use 可能 clas 似的 () 目前 div 前言:今天重新梳理了一下前端方面的知識,發現學習東西還是要用,不然忘得快,廢話不多說,開始!! 一.模板繼承 1.概念: 書上說,模板繼承,類似Python上的繼承; 其實個人覺得和所有繼承
HTML基本代碼教學片,認識HTML
語言 什麽是html 1-1 utf 容易 ont ima 字體 復雜 今兒頭午有點暈暈的感覺,咳咳,甩甩頭開課 HTML 定義:
HTML基本代碼教學,第二天
href 問題 圖片加載 桌面 顯示器 wid htm div 每次 HTML 咱們今天來看一下咱們這HTML能做些什麽,例如下圖(最低級
HTML培訓課程-------Day01(HTML基本元素)
small 圖片 英文 十六進制 src 設置 描述 face 排列 HTML基礎 HTML的基本結構 HTML標記的格式 (1)<標記名稱>單一型,無設置值的。 如:<br> (2)<標記名稱 屬性=”屬性值”>
JS——html基本結構
html標簽 .cn document htm upload ima common 技術分享 doc document.title——文檔標題 document.head——文檔頭標簽 document.body——文檔的主體 document.documentElemen
html基本代碼書寫
按鈕 += for mil hid 代碼 eth method post html的書寫: datagrid---->toolbar---->按鈕---->handler:function() var rows=$("gridId").datagrid(‘
web前端學習(3):認識HTML基本標簽
鼠標 首頁 一份 格式 所在地 有著 同時 網上 今天 本章主旨: 介紹常用的文本相關標簽,如<h>,<p>,<a>;簡介常見的HTML標簽屬性,如title屬性,href屬性,id/class屬性等;重點掌握<a>標簽。
VS2017基礎 修改Html的模板
csharp 出現 校驗 rto mage 技術 nbsp param 完成 禮悟: 公恒學思合行悟,尊師重道存感恩。葉見尋根三返一,江河湖海同一體。 虛懷若谷良心主,願行無悔給最苦。讀書鍛煉養身心,誠勸且行且珍惜。 os:Wind
Vue-雙向綁定:從 html 到 模板 到 渲染函數
nts 不能 emp data AD ide dstar 模板 filter 在 Vue 中,可以利用 v-model 語法糖實現數據的雙向綁定,例如:<div id="app"> <input type="text" v
HTML基本教程,及一些基本常用標簽。
結構 教程 strong pos OS 百度一下 align 百度 fff HTML基本結構,及常用標簽 <DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <ti
HTML基本結構
方式 IT col html5 不存在 har charset 無法 AR <!DOCTYPE html> <html> <head> <meta charset="utf-8"> &
移動前端不得不了解的HTML5 head 頭標簽 —— HTML基本的頭部標簽
AR con 模式 har tro -h intern 標簽 標準 HTML的頭部內容特別多,有針對SEO的頭部信息,也有針對移動設備的頭部信息。而且各個瀏覽器內核以及各個國內瀏覽器廠商都有些自己的標簽元素,有很多差異性。移動端的工作已經越來越成為前端工作的重要內容,除了平
Java學習總結(二十三)——前端:HTML基本標簽的使用
water 默認值 right 列表框 信息工程 area led mea MF 一.HTML概述1.HTML:(Hyper Text Markup Language)超文本標記語言,是一種專門用於創建Web超文本文檔的編程語言,它能告訴Web瀏覽程序如何顯示Web文檔(即