html - 有哪些工具可以调试 css?

标签 html css

我为这件事焦头烂额。人们使用什么工具来调试 css 的格式问题?我有一些相对简单的导航格式,使用 css 看起来像这样:

/* sub navigation */
.sidenav {
    float: right;
    width: 218px;
}
.sidenav h1 {
    background: #BCB39F url(img/sidenavh1.gif) repeat-x;
    border-bottom: 1px solid #999;
    border-top: 1px solid #CCC;
    color: #4A4A44;
    font-size: 1.2em;
    height: 22px;
    margin: 0;
    padding-left: 12px;
}
.sidenav h1 a {
    color: #554;
    text-decoration: none;
    display: block;
}
.sidenav h1 a:hover {
    background: #D6CCB9;

    color: #654;
}

然后我的页面中有这段代码:

<div class="sidenav">
<a href="ceremony">Wedding Ceremony</a> 
<a href="reception">Wedding Reception</a> 
<div class="clearer"></div>
</div>

而且它不接受风格。它工作正常,所以我在其他地方的一个更改一定是把某些地方弄错了(我怀疑是某个地方,但我真的很难找到它是什么。我的其余页面格式很好......)

有什么建议吗?


感谢 Firebug 找到了答案。

未应用格式,因为链接的格式仅适用于 <h1> 中的链接元素 - 即 html 应该是:

<div class="sidenav">
<h1><a href="ceremony">Wedding Ceremony</a></h1>
<h1><a href=reception">Wedding Reception</a></h1>
<div class="clearer"></div>
</div>

最佳答案

firebug .还有一个在 IE 中运行的纯 javascript 版本,称为 firebug lite .

它允许您随时关闭或更改您想要的任何 CSS

关于html - 有哪些工具可以调试 css?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/541716/

相关文章:

html - 图片和菜单栏周围的空间

html - 将 UL block 与 DIV block 的底部对齐

javascript - CSS 以时间间隔显示 div 作为工具提示

javascript - 如何在显示时隐藏元素: none doesn't work

html - 防止 Skype 突出显示损坏文本区域

php - 我如何将文本从textarea发布到mysql数据库

python - 如何从 views.py 测试选中的单选按钮?

jquery - 多个 youtube 视频的占位符图像

jquery - div 鼠标进入时显示,鼠标移出时隐藏

html - 与 SVG 相关的按钮位置 - 如何配置一致的位置