您好,登錄后才能下訂單哦!
這篇文章給大家分享的是有關HTML5移動端手機網站基本模板的示例代碼的內容。小編覺得挺實用的,因此分享給大家做個參考,一起跟隨小編過來看看吧。
HTML5移動端最根底網頁模板代碼(如下HTML代碼可直接拷貝復制使用):
<!doctype html> <html> <head> <meta charset="utf-8"> <title>手機站點最根底HTML模板</title> <meta name="keywords" content="" /> <meta name="description" content="" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" /> <meta name="format-detection" content="telephone=no" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="author" content="CSS5, css5.com.cn" /> <style> body{font-size:62.5%;font-family:"Microsoft YaHei",Arial; overflow-x:hidden; overflow-y:auto;} .viewport{ max-width:640px; min-width:300px; margin:0 auto;} </style> </head> <body> <div> 各人好!迎接CSS5學習HTML開荒! </div> </body> </html>
HTML5主要代碼剖明:
1、代碼:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
抒發:
width ---- viewport的寬度(width=device-width含意是:寬度即是裝備寬度)
height ------ viewport的高度(height=device-height含義是:高度即是裝備寬度)
initial-scale ----- 初始的縮放比例
minimum-scale ----- 容許用戶縮放到的最小比例
maximum-scale ----- 允許用戶縮放到的最大比例
user-scalable ----- 用戶能否也許手動縮放
2、代碼
<!doctype html>
評釋:
doctype簡寫,簡寫HTML申明,支持PC和移動,不光僅贊成HTML5瀏覽器贊成,贊成HTML4的閱讀器也支持。
3、代碼:
<meta name="format-detection" content="telephone=no" />
標明:
IOS與Android零碎都市默認某長度內的數字為電話號碼,縱然不加也是會默許表示為電話的。
4、代碼:
<meta name="apple-mobile-web-app-capable" content="yes" />
講明:
準予全屏模式瀏覽,竄伏閱讀器導航欄
5、代碼:
<meta name="apple-mobile-web-app-status-bar-style" content="black">
評釋:
它指定的iphone中safari頂真個外形條的花樣
默許值為default(雪白色),大約定為black(彩色)和black-translucent(灰色半無色)
其他還有一個共性化的link標簽,它贊成用戶將網頁建立極快辦法到桌面時,其圖標釀成咱們本身界說的圖標。
以上幾個標簽與代碼,一定要主宰并熟悉。另有HTML5移動網頁框架寬度一般不設置固定值,一樣平常以百分比為寬度,例如最外層主框架寬度100%,再配置最小寬度min-width:320px,何等便可。
額定留神:HTML5移動網頁拓荒時,網頁結構不宜蕪雜不像疇昔PC分許多列各類千般組織,再HTML5電話端網頁一般就構造一列的內容。
感謝各位的閱讀!關于“HTML5移動端手機網站基本模板的示例代碼”這篇文章就分享到這里了,希望以上內容可以對大家有一定的幫助,讓大家可以學到更多知識,如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。