css样式表常驻留在文档的什么区域中
时间:2021-04-08 来源:互联网
今天PHP爱好者给大家带来css样式表常驻留在文档的“head”区域中。因为如果将CSS放在底部,页面可以逐步呈现,但在CSS下载并解析完毕后,已经呈现的文字和图片就要需要根据新的样式重绘,这是一种不好的用户体验。希望对大家有所帮助。
本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。
css样式表常驻留在HTML文档顶部的head中。
why?
<link rel="stylesheet" href="home.css">
link标签里面的href(HyperText reference)属性表示超文本引用,当CSS使用href引用,浏览器会识别该文档为CSS,并行下载,不会停止对当前文档的加载,在加载html生成DOM tree的时候,就可以同时对DOM tree进行渲染,这样可以防止闪跳,白屏或者布局混乱。
最理想的情况,我们希望浏览器逐渐的渲染下载好的CSS,将页面逐渐的展现给用户。但是浏览器为了避免样式变化时重新渲染绘制页面元素,会阻塞内容逐步呈现,浏览器等待所有样式加载完成之后才一次性渲染呈现页面。
CSS文件如果放置底部,浏览器阻止内容逐步呈现,浏览器在等待最后一个css文件下载完成的过程中,就出现了“白屏”(新打开连接时为白屏,尔后先出现文字,图片,样式最后出现)。这点非常严重,因为在网速非常慢的情况下,css下载时间比较长,这样就给用户带来“白屏”的时间自然也就很长了,用户体验非常差。
将CSS放在底部,页面可以逐步呈现,但在CSS下载并解析完毕后,已经呈现的文字和图片就要需要根据新的样式重绘,这是一种不好的用户体验。
以上就是css样式表常驻留在文档的什么区域中的详细内容,更多请关注php爱好者其它相关文章!
-
以太坊浏览器是干什么的?常用以太坊浏览器推荐 2025-07-19
-
以太坊生病了?Solana会超越以太坊吗? 2025-07-19
-
以太坊质押多久可以解押?以太坊质押币种有哪些? 2025-07-19
-
MEI Pharma宣布设立1亿美元莱特币资金库,成为首家将LTC作为储备的上市公司 2025-07-19
-
比特币一度跌破11.7万美元、以太坊失守3,600,全网爆仓8亿镁 2025-07-19
-
做空加密货币的方式有哪些?如何做空数字货币 2025-07-19