`
fuhao_987
  • 浏览: 63672 次
  • 性别: Icon_minigender_2
  • 来自: 北京
社区版块
存档分类
最新评论

加速网站速度的最佳做法_(2)把样式表放在顶部

阅读更多
    在雅虎性能的研究中,我们发现把样式表放在HEAD中使得页面看起来加载比较快。因为把样式表放在HEAD使得页面能够逐步呈现。
    前端工程师关注性能,希望页面能够快速的加载,也就是说希望浏览器能够尽快地显示内容。这对拥有很多内容的页面来说是很重要的,对那些网络比较慢的用户来说也是重要的。给用户提供可视化的回馈是很重要的,比说进度指标,这些都得到了很好的研究也有相应的文档http://www.useit.com/papers/responsetime.html。我们认为HTML页面是一个过程页面。当浏览器加载页面的时候,是按照头,导航条,顶部的logo等,给用户可视化得呈现出来。这可以提高用户的整体体验。

把样式表放在底部的问题是:它使得很多浏览器不能逐步呈现,包括IE。这些浏览器会采用块渲染的方式,以避免当样式改变时重画元素。用户将会被卡住观看一个空白页。

HTML规则http://www.w3.org/TR/html4/struct/links.html#h-12.3清楚的说明了样式表需要被包含在HEAD中。“不同于A,[LINK]需要出现在HEAD中,当然它可以出现很多次。”对于空白屏幕或者是无样式的FLASH,都是值得牺牲的。最优的解决方法就是遵循HTML的规范,并且把你的样式表放在HEAD中。
分享到:
评论

相关推荐

    css层叠样式表手册_css样式表_css层叠样式表_css样式表下载

    css层叠样式表手册_css样式表_css层叠样式表_css样式表下载css层叠样式表手册_css样式表_css层叠样式表_css样式表下载css层叠样式表手册_css样式表_css层叠样式表_css样式表下载

    qss样式表模板,包括了17种样式表。

    2. **17种样式表模板** 这17种模板可能涵盖了各种常见的UI设计风格,例如扁平化、 Material Design、iOS风格、Windows样式等。每种模板都代表了一种独特的设计思路,可以快速应用到你的Qt项目中,以实现不同的界面...

    QT样式表45套,带Demo及样式表,一键切换

    2. **C++源代码(.cpp/.h)**:包含了Demo程序的实现,可能包括加载和应用样式表的函数,以及切换样式的方法。 3. **资源文件(.qrc)**:可能包含了一些图标或者其他图形资源,这些资源可能会被样式表引用。 4. **...

    QT精美样式表,超级好看

    2. 编辑框(QLineEdit):可以定制编辑框的背景色、文字颜色、边框样式,甚至可以添加水印效果。 3. 进度条(QProgressBar):样式表可以调整进度条的填充颜色、背景颜色以及进度条的形状和宽度。 4. 下拉框...

    将样式表放在页面顶部

    首先,我们来看为什么要把样式表放在页面的部分。当浏览器解析HTML文档时,它会按照顺序执行:从上到下,从左到右。如果样式表被放在部分,浏览器在遇到它们之前必须先加载整个页面结构。因为浏览器默认会阻止页面...

    引入css样式表的四种方式介绍.rar

    2. 内部样式表(内部链接): 内部样式表通常放在HTML文档的`<head>`部分,通过`<style>`标签包裹CSS规则。例如: ```html <!DOCTYPE html> 内部样式表示例 p { color: red; font-size: 20px; } 这...

    QSS样式表大合集.rar

    QSS样式表大合集,基本涵盖了你能看到的所有样式表,各种精美风格都在其中......

    几款比较好用的QSS样式表

    为了保持代码的组织性和可维护性,QSS支持嵌套样式和导入其他样式表。这使得复杂的应用程序可以有效地管理其样式。 6. **自定义控件和样式**: Qt允许开发自定义控件,QSS也能应用于这些自定义控件。通过重写`...

    QSS样式表(带书签)

    首先,从标题我们可以得知,这份文件讲的是关于“QSS样式表”的知识,QSS是Qt Style Sheets的缩写,它是一种样式表语言,类似于网页开发中的CSS(层叠样式表),用于在Qt应用程序中定义和控制界面的外观。...

    Qt样式表使用大全(中文整理资料)

    2. 在Qt Designer中设计界面时,可以为控件直接设置样式。Qt Designer是Qt提供的一个可视化界面设计工具,允许用户直接在工具中为控件定制样式。 3. 在项目的资源文件(.qrc)中添加样式表文件,然后在程序启动时...

    QSS样式表素材合集.rar

    2. **样式表GUI**:这可能是某种图形用户界面工具,允许用户直观地设计和预览QSS样式。这样的工具对于非程序员或者想要快速调整界面视觉效果的开发者非常有用。通过拖放和编辑属性,可以生成对应的QSS代码,然后应用...

    QT下拉框样式表设置

    ### QT下拉框样式表设置详解 在QT中,我们经常需要对用户界面进行自定义样式设置以满足不同场景下的视觉需求。其中,`QComboBox`(即下拉框)是一种常用的控件,用于提供一系列选项供用户选择。本文将详细介绍如何...

    Dreamweaver CS4和CS5 CSS样式表汉化补丁

    dreamweaver cs5和cs4虽然好用,但有个缺陷就是样式表编辑器还是英文的,没有汉化过来,即使是从官方下载的原版中文版也是这样,也许adobe这么做的原因是想把源代码的样式名统一起来,但这样对于新手来说有点困难了...

    Qt样式表葵花宝典.zip

    《Qt样式表葵花宝典》是一份详尽的指南,专为想要深入理解并熟练应用Qt样式表的开发者设计。这份宝典以其全面性、易用性和实用性赢得了高度赞誉,其中包含了各种Qt样式表的使用技巧和实例,旨在帮助读者轻松掌握这一...

    Qt CombBox下拉列表自定义(使用样式表)

    2. 字体样式:通过`font-family`、`font-size`、`font-weight`等属性改变字体。 3. 颜色:可以设置文字颜色、选中项颜色、鼠标悬停时的颜色等,如`color`、`selected-color`、`hover-color`。 4. 边框:使用`border`...

    reset.css重置样式表

    重置样式表

    QT 黑色风格+白色风格+淡蓝色风格样式表

    2. **特定控件应用**:除了全局应用样式,也可以针对特定控件设置样式。例如,为一个`QPushButton`设置样式: ```cpp QPushButton *button = new QPushButton("Click me"); button->setStyleSheet("QPushButton {...

    QSS样式表.rar

    非常好看的各种QSS样式表,里面附上了关于怎么Qt调用这些QSS样式表方法,非常非常好看,有灰色、蓝色、亮蓝色、PS黑色、普通黑色和红蓝色等等各种样式,写界面时必用资源,内附自己可以创建属于自己样式表的GUI程序...

    EasyUI_Icon_图标扩展样式(1775个)

    这个名为“EasyUI_Icon_图标扩展样式(1775个)”的压缩包,显然提供了一个包含1775个图标的集合,旨在增强EasyUI项目的视觉效果。这些图标可能涵盖各种类别,如导航、编辑、状态、警告、设置等,为开发者在创建页面...

    QSS样式表之PS黑色风格+白色风格+淡蓝色风格

    其中,QSS(Qt Style Sheets)是Qt提供的一种样式表语言,类似于网页设计中的CSS(Cascading Style Sheets),用于定制Qt应用程序的外观和感觉。 标题提到的"QSS样式表之PS黑色风格+白色风格+淡蓝色风格",是指利用...

Global site tag (gtag.js) - Google Analytics