通常css文件放在里面<head></head>,如果我把它放在里面<body></body>,它会有什么区别？
我的主要目标是允许尽可能快地加载几个页面.为此,我想利用缓存和一种"特殊技术",作为后备,依赖于标准缓存.
在后端我有以下结构.public_html中有一个主页面和几个子页面,每个子页面都有不同的特定css规则.所有最小化文件的创建都是通过脚本完成的,因此没有额外的复杂性.为简单起见,我们假设这是结构,虽然它更复杂:
/public_html
/index.php
/style.css ~50kb
/min.css ~100kb
/subjects
/index.php
/style.css ~20kb
/min.css ~10kb
/books
/index.php
/style.css ~20kb
/min.css ~10kb
...
因此,当用户第一次在子页面上输入时,他们将收到此HTML代码:
<!DOCTYPE html>
<html>
<head>
<link href="/subjects/min.css" rel="stylesheet" type="text/css">
</head>
<body>
All the body here
<link href="/min.css" rel="stylesheet" type="text/css">
</body>
如您所见,用户在一个小文件中加载标题中该页面所需的所有css代码.请注意,这/subjects/min.css比/min.css第一个加载更快的请求要小得多.然后,在完整的html和css正确加载后,/min.css将开始加载.此文件包含所有子页面样式.
请注意,将标记置于标记<link>内是合适的<body>,即使它不起作用,也没有问题,因为已经加载了特定于页面的样式.我为什么要在这里加载？继续阅读:
对于该会话的第二个及后续请求,用户将收到此html代码:
<!DOCTYPE html>
<html>
<head>
<link href="/min.css" rel="stylesheet" type="text/css">
</head>
<body>
All the body here …