我是在一个大型Drupal站点构建结束时进入的,并且生成的CSS文件是......详细且不够整洁,至少可以说!
是否有任何工具可以检查整个网站a)查看是否有未使用的样式和b)使用样式的频率(从而有助于重构它们).
我已经看过CSS Roundup Firefox Addon,但这依赖于手动点击所有页面,我想确保我不删除任何正在使用的样式.
编辑:找到Stack Overflow上的现有帖子题为如何在网站中找到未使用的图像和CSS样式?这有什么工具可以分析我的网站和未使用/不需要CSS报告?
这应该很容易.我在一个声明的路径变量gulpfile.js:
paths = {
img: [
'src/patternlab/**/**/*.jpg',
'src/patternlab/**/**/*.png'
]
};
Run Code Online (Sandbox Code Playgroud)
我想使用一个简单的OR开关作为文件扩展名,顺序如下:
'src/patternlab/**/**/*.(jpg|png)'
Run Code Online (Sandbox Code Playgroud)
但我找不到合适的语法!尝试了多种排列,通过MDN等查看...
我想使用外部样式表来设置一些SVG精灵,详见本Sitepoint教程和W3C的SVG样式.
但是,CSS不是非常,标准:
rect {
fill: red;
stroke: blue;
stroke-width: 3
}
Run Code Online (Sandbox Code Playgroud)
因为它没有使用W3C CSS Validator进行验证.
是什么赋予了?
我使用SVG 文件本身中的preserveAspectRatio和viewBox属性创建了一个可扩展的 SVG 对象:
<svg
…
width="800"
height="800"
preserveAspectRatio="xMinYMin meet"
viewBox="0 0 800 800"
…
Run Code Online (Sandbox Code Playgroud)
在 HTML 中,我使用<object>标签引用了 SVG 文件并将其包装为一个<a>标签(我想这样做以便以后可以对其进行样式设置):
<a>
<object type="image/svg+xml" data="smiley.svg">
</object>
</a>
Run Code Online (Sandbox Code Playgroud)
我<object>使用一些 CSS 设置标签的样式,使其宽度为 50%,宽度不超过 100%:
object {
max-width: 100%;
width: 50%;
}
Run Code Online (Sandbox Code Playgroud)
问题是锚标记并没有环绕对象!

任何人的想法?
我有很棒的HTML5 javascript shim链接到我的<head>.
除了它在页面顶部显示标签,它工作正常,即:
<!--[if lt IE9]> <![endif]-->
当我查看源代码时,它看起来绝对精致和花花公子.我完全不知道发生了什么!
css ×2
svg ×2
frontend ×1
gulp ×1
html ×1
javascript ×1
object ×1
regex ×1
validation ×1
viewbox ×1