1 . HTML5文档结构
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>页面标题</title>
</head>
<body>
</body>
</html>
-
Viewport设置
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0">
快捷键:meta:vp+tab键
说明:此属性为移动端页面视口设置,当前值表示在移动端页面的宽度为设备的宽度, 并且不缩放(缩放级别为1)960px 内被套在一个宽度为980px(绝大多数设备的视口默认尺寸)的容器(视口)中,将视口缩放到设备的真实尺寸中进行展示
-
浏览器兼容模式
<meta http-equiv="X-UA-Compatible" content="IE=edge">
快捷键:meta:compat + tab键
说明:此属性为文档兼容模式声明,表示如果在IE浏览器下则使用最新的标准渲染当前文档 -
favicon(站点图标)
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
快捷键:link:favicon + tab键
-
引入相应的第三方文件
<link rel="stylesheet" href="bootstrap.css"> <link rel="stylesheet" href="index.css"> ... <script src="jquery.js"></script> <script src="bootstrap.js"></script> <script src="index.js"></script>
-
设置默认字体
body{
font-family: "Helvetica Neue",
Helvetica,
Microsoft Yahei,
Hiragino Sans GB,
WenQuanYi Micro Hei,
sans-serif;
}