HTML骨架

最新推荐文章于 2025-08-05 17:49:47 发布

fangyinggui

最新推荐文章于 2025-08-05 17:49:47 发布

阅读量371

点赞数 4

CC 4.0 BY-SA版权

分类专栏： html 文章标签： html 前端

本文链接：https://blog.youkuaiyun.com/monian187/article/details/147498597

html 专栏收录该内容

23 篇文章

订阅专栏

在这里插入图片描述

常用骨架结构

<!-- -->
<!-- 文档声明，告诉浏览器该网页的HTML版本（HTML5版本） -->
<!DOCTYPE html>

<!-- 标识网页使用的语言，可用中文标识，但不用 -->
<html lang="en">
<!-- head头部标签 -->
  <head>
	<!-- 标识网页使用的字符编码(utf-8:收录所有被认证国家的语言) -->
    <meta charset="UTF-8" />
    <!-- 解决ie浏览器兼容性问题 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <!-- 移动端网页视口设置（设置宽度为视口宽度） -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <!-- 设置页面标题 -->
    <title>documentName</title>
    <!-- 链接外部文件 -->
    <link rel="stylesheet" href="" />
    <!-- 定义网页的内部样式 -->
    <style></style>
  </head>
  <body>
  	<!-- 书写或引用脚本文件 -->
    <script></script>
  </body>
</html>

link>（无注释）源码（可复用）

doctype

DOCTYPE 是 html5 标准⽹⻚声明，且必须声明在 HTML ⽂档的第⼀⾏。

来告知浏览器的解析器⽤什么⽂档标准解析这个⽂档，不同的渲染模式会影响到浏览器对于 CSS 代码甚⾄ JavaScript 脚本的解析。

【⽂档解析类型】

（1）BackCompat：怪异模式，浏览器使⽤⾃⼰的怪异模式解析渲染⻚⾯。（如果没有声明 DOCTYPE，默认就是这个模式）
（2）CSS1Compat：标准模式，浏览器使⽤ W3C 的标准解析渲染⻚⾯。
（3）IE8 还有⼀种介乎于上述两者之间的近乎标准的模式，但是基本淘汰了。

【⽂档解析类型：3 种模式的区别】

标准模式(standards mode)：⻚⾯按照 HTML 与 CSS 的定义渲染；
怪异模式(quirks mode)：会模拟更旧的浏览器的⾏为；
近乎标准模式(almost standards)：会实施了⼀种表单元格尺⼨的怪异⾏为（与 IE7 之前的单元格布局⽅式⼀致），除此之外符合标准定义

字符编码

【字符编码（了解）】

<meta charset="UTF-8" />
标识网页使用的字符编码

【作用】：保存和打开的字符编码需要统一设置，否则可能回出现乱码。

【常见字符编码】：

UTF-8：万国码，国际化的字符编码，收录了全球语言的文字。

GB2312：6000+汉字；

GBK：20000+汉字；

注意：开发中，统一使用 UTF-8 字符编码即可；