html - 将 cute-slider 与 HTML5 样板集成

Question

使用 HTML5Boilerplate 优化包含可爱 slider 的页面时，幻灯片会下降大约 15 像素，列表样式的光盘会返回。这可以在 http://www.quailparkoflynnwood.com/dev/index.htm 看到(未压缩)和 http://www.quailparkoflynnwood.com/dev/publish/index.htm (压缩)。任何对查明其原因的见解都将不胜感激。我的后备方案是不压缩包含 slider 的页面。

Answer 1

我没有看到 slider ，带圆盘的图像实际上是列表项中的图像，因此您在 div#slideshow 中得到了一个无序列表；也许 normalize.css 没有覆盖无序列表的样式规则。

将以下代码添加到样式标签或 css 文件中以删除该样式

#slideshow ul {
list-style-type: none !important; /*remove disc !important to override other rules */
padding: 0; 

您网站的页面速度得分为 51/100 :(你有很多 404(对不存在的资源的错误请求)和大图像(也没有优化)。 84c8a31.css 又大又小，似乎有重复的样式规则。

就我个人而言，我不会使用 js/css minifcation，因为它会导致非常复杂的进一步维护，以换取节省 som kb 和几个请求，我认为这非常划算/有效(对于常规大小的网站)。

如果你想优化你的网站，开始优化和调整你的图像大小，找到并删除你所做的所有错误请求，尝试只加载一两个你实际使用的样式规则的 css 文件，把脚本放在最后.

准备就绪后:gzip 文件并使用 .htaccess 文件添加缓存 header

祝开发者好运!