0 0 1 3 - 页面#根元素属性html 之 lang & mainfest属性

不二如是 · 发表于 2017-1-10 19:56:28

马上注册，结交更多好友，享用更多功能^_^

您需要登录才可以下载或查看，没有账号？立即注册

x

本帖最后由不二如是于 2021-8-11 09:11 编辑

在12，我们知道了HTML的基础：标签、属性

所谓的页面根元素，就是：

在HTML文档中，元素<html>代表了文档的根，其他所有的元素都是在该元素的基础上进行延伸或拓展的。

该元素也是HTML文档的最外层元素，因此也称为根元素。

这一帖，专攻，页面根元素html中最常用的两个属性 - lang & manifest。

lang，理解为语言文件 ； manifest，理解为文档的缓存

lang

<html lang="en"> 英文
<html lang="zh-CN">中文
<html lang="fr">法文

manifest

简直是好用的不要不要的！

一旦设置后，便会将需要缓存的文件保存在本地

CACHE MANIFEST

NETWORK

FALLBACK

<!doctype html>
<html manifest="first_cache.manifest">
<head>
        <title>一起测试manifest缓存</title>
        <link href="css.css" rel="stylesheet">
</head>
<body></body>
</html>

请点这里

body{
        background:#FF0088;
}

CACHE MANIFEST
#修改时间：2016-1-10 20:22
CACHE:
css.css

当有多个文件，每一个文件路径都需要各占一行

时间

文件版本

刮刮乐：

本地使用manifese无法成功，请见置顶贴正解

这位鱼油，如果喜欢本帖子，请订阅专辑-->（传送门）（不喜欢更要订阅

）

官方 Web 课程：

joker11111 · 发表于 2017-2-14 00:37:58

本帖最后由 joker11111 于 2017-2-14 00:39 编辑

蜜汁尴尬，manifest似乎用不了

环境是：win7+chrome

chrome浏览器F12后似乎没有出现缓存的first_cache.manifest文件，断网后修改颜色，依然可以显示

看W3c上的解释：

在想是不是需要在服务器上配置，貌似并没有服务器的权限

也看到博客有人说缓存成功，chrome浏览器F12后console会有缓存信息，如下图，依旧没有找到
博客地址：http://blog.csdn.net/tsxw24/article/details/8315672

有点费解，留坑一枚，待弄清再填

也期待有会的朋友解疑答惑，灰常感谢

shishunfu · 发表于 2017-4-19 09:13:46

不二如是发表于 2017-2-14 08:00
哈哈，我当时故意搭的服务器，做出来manifest效果

本地单机是无法实现滴！

服务器，搭建个tomcat？

alltolove · 发表于 2017-1-11 15:14:06

这么复杂

不二如是 · 发表于 2017-1-11 16:13:40

alltolove 发表于 2017-1-11 15:14
这么复杂

manifest主要适用于不依赖网络，且下载后不需要更行的地方
像，HTML5的游戏、应用界面等。

而现在，比起没网，大家99%会有网！
所以，了解下就好，有需求知道去哪里找就行

不二如是 · 发表于 2017-2-14 08:00:23

joker11111 发表于 2017-2-14 00:37
蜜汁尴尬，manifest似乎用不了

环境是：win7+chrome

哈哈，我当时故意搭的服务器，做出来manifest效果

本地单机是无法实现滴！

另外被joker这么优质的学习帖‘震’到了！！！

joker11111 · 发表于 2017-2-14 08:31:50

不二如是发表于 2017-2-14 08:00
哈哈，我当时故意搭的服务器，做出来manifest效果

本地单机是无法实现滴！

哈哈哈哈，感觉要玩大家来找茬了，你只管写，我只管找茬

自己搭的服务器

，崇拜崇拜，还不知道服务器是什么鬼呢，自己简直弱爆了

不二如是 · 发表于 2017-2-14 08:41:27

joker11111 发表于 2017-2-14 08:31
哈哈哈哈，感觉要玩大家来找茬了，你只管写，我只管找茬

自己搭的服务器，崇拜崇 ...

其实超级简单～

留个悬念，后面肯定会介绍到

欢迎提供更多优质回复！

向一朵朵鲜花 · 发表于 2017-3-4 16:55:30

表示打开后重新修改css颜色界面还是改变了，，

会魔法的魔法 · 发表于 2017-3-15 16:31:58

manifest 修改之后页面要刷新两次很不友善

会魔法的魔法 · 发表于 2017-3-15 16:36:56

还有就是出现了个请求 favicon.ico 的bug

不二如是 · 发表于 2017-3-15 16:39:34

会魔法的魔法发表于 2017-3-15 16:36
还有就是出现了个请求 favicon.ico 的bug

见4#，置顶帖

shishunfu · 发表于 2017-4-19 09:48:01

交作业

<!DOCTYPE html>        <!--在HTML文档中，元素<html>代表了文档的根，其他所有的元素都是在该元素的基础上进行延伸或拓展的。-->
<html lang="en" manifest="first_ManifestCace.appcache"><!--页面根元素html中最常用的两个属性 - lang & manifest。lang，理解为语言文件 ； manifest，理解为文档的缓存-->
<!--重要的提示：以 "#" 开头的是注释行，但也可满足其他用途。应用的缓存会在其 manifest 文件更改时被更新。如果您编辑了一幅图片，或者修改了一个 JavaScript 函数，这些改变都不会被重新缓存。更新注释行中的日期和版本号是一种使浏览器重新缓存文件的办法。-->
<!--first_ManifestCace.appcache文件解释说明:
        第一行，是manifest文件的声明。
        第二行，是一段以‘#’开头的注释，表明版本或者修改时间。
        第三行，”CACHE“是对需要缓存的文件的声明。
        第四行，为缓存的文件列表，声明了css.css文件作为缓存的对象。-->
<link rel="stylesheet" href="0009CSS.css">
<head>
        <meta charset="UTF-8">
        <title>测试manifest离线缓存</title>
</head>
<body>
        <div id="container">
                <h1>我爱鱼C</h1>
                <p>让编程改变世界!<br/>Change the world by program!</p>
                <a href="http://www.fishc.com/" id="first_Js">传送门</a>
                <a href="http://bbs.fishc.com/forum.php?mod=collection&action=view&ctid=539" id="first_Js2">HTML5-庖丁解牛</a>
        </div>
        <script src="0008JS.js"></script>
</body>
</html>

aswyamato1989 · 发表于 2017-7-13 07:23:01

继续学习

ttyhtg · 发表于 2018-2-9 10:13:47

这是不是意味着缓存实验失败了？

微末非末 · 发表于 2018-2-22 19:22:40

这个故事告诉我们看帖先看评论

ttyhtg · 发表于 2018-3-13 10:49:08

微末非末发表于 2018-2-22 19:22
这个故事告诉我们看帖先看评论

是的

土耳其东木白 · 发表于 2018-5-29 16:04:16

都一年前了亲

枫丹白露666 · 发表于 2018-6-21 20:07:12

joker11111 发表于 2017-2-14 00:37
蜜汁尴尬，manifest似乎用不了

环境是：win7+chrome

那个，能解释的再明白点吗？

初学者，不明白

谢谢你

542624047 · 发表于 2018-7-29 15:45:39

刮刮乐刮出来个错字，不是manifest吗？

账号		自动登录	找回密码
密码			立即注册

[庖丁解牛] 0 0 1 3 - 页面#根元素属性html 之 lang & mainfest属性

马上注册，结交更多好友，享用更多功能^_^

评分

本帖被以下淘专辑推荐:

点评

评分

点评