Ste*_*ins 17 html css rendering order-of-execution
如果我的<head></head>HTML页面部分中包含外部样式表,它们是否会在HTML之前加载并立即应用于渲染？让我介绍一下我的具体用例.
外部styles.css文件:
form label {
display: none;
}
包含表格的页面:
<head>
<link rel="stylesheet" href="styles.css" type="text/css" />
</head>
<form action="process.php" method="post">
<label for="name">Name</label>
<input type="text" id="name" name="name" />
</form>
我可以确信标签在页面加载时是不可见的(由于CSS下载没有闪烁)吗？
否则,我可以内联添加样式属性,但这可能是维护的噩梦.
Emi*_*mil 10
如果在头部分中包含CSS,则可以确信标签不会显示.
首先下载HTML.浏览器开始从顶部读取html,并开始获取HEAD部分中引用的所有CSS和JavaScript文件.在下载并评估HEAD中的所有CSS和JavaScript文件之前,不会绘制(显示)页面.
小智 6
样式表不会阻止文档被下载,但是在所有链接的样式表都已下载并加载到DOM中之前,浏览器不会呈现文档.
这样浏览器不需要渲染页面两次(在此过程中浪费时间),因此在下载和解析样式表之前,无样式的页面不会在用户面前闪烁.