有什么方法可以“进入浏览器引擎”(例如chrome上的webkit),查看css声明是如何解释的以及识别错误?
我的意思是,在“检查元素”下,您可以在开发人员工具中看到哪些CSS规则将其设置为HTML对象。但是从这一点来看,如果CSS本身是错误的,则对于大多数错误,您将无法查看错误所在。
例如:假设我写了
“ -webkit-animation:fgfdgfdgdf 500ms”
代替
“ -webkit-animation:MyAnimation 500ms”
我想得到类似“找不到对象fgfdgfdgdf”错误的信息。
或者说我写了:
“左:200px;
位置:静态;”
浏览器将因为“ position:static”而忽略“ left”属性。有什么办法可以使“ left”属性出现某种错误-诸如“由于静态定位导致属性无效”之类的东西?
谢谢。
最佳答案
基本上,我认为这取决于您的知识。这是一项技能,需要大量的热情和专业知识才能正确完成。
以下是一些可以用来指导您的基准。
取自-http://css-tricks.com/judging-css-spotting-bad-code/
显而易见的考验
查看网站。如果看起来一团糟,那么他们做得不好。
更进一步,请对照您同意的浏览器进行检查。该设计应该在所有这些设计中都是可行的。
如果设计应该是响应式的,请调整浏览器窗口的大小,以确保无论宽度或高度如何设计都可以工作。
如果一切看起来都不错,那就是一个好(也是必需的)第一步。但这并不是绝对证明CSS良好的证据。
格式化测试
查看创作的CSS文件。请记住,最佳做法是为实时网站提供最小化的CSS(已删除所有不重要的空格),因此请不要着急。
这不应该被人类阅读。查看他们实际创建的文件。
如果您希望遵循既定的样式指南,是否遵循了?
如果不是,看起来是否一致-好像他们遵循自己的样式指南一样?还是有点草率?草率的意思是选择器后面有时只有一个空格,有时没有选择符。有些代码块是缩进的,而其他代码不是。单行CSS与多行CSS混合在一起,没有韵律或理由。
干净的代码是受人尊敬的开发人员的标志。尊重工艺和所做工作的人。
如果前两个测试通过,那就太好了。但是仍然不能完全证明CSS是好的。
选择器测试
前两个测试几乎可以由任何人完成,但是从现在开始,您需要自己熟悉CSS。开始阅读CSS,看看您所看到的对您是否有意义。
CSS ...
.article #comments ul > li > a.button {
/* Crazy town */
}
希望这可以帮助...