为什么我的班级 ID 标签不起作用？答案

【问题标题】：Why aren't my class id tags working?为什么我的班级 ID 标签不起作用？
【发布时间】：2013-03-27 03:01:15
【问题描述】：

这是我的网站：

我有两个问题。

1。我不明白为什么侧边栏导航中的文本不是黑色的！它是蓝色的。

#side_wrapper_text a:link{
        font-family: 'Playfair Display', sans-serif;
        font-size: 32px;
        font-style: italic;
        font-weight: 100; 
        color:rgba (255,255,255,1);
        text-decoration: none; 
        text-align: right;
        letter-spacing:0.2em;

}

2。我希望文本在其框的顶部完全对齐，但我无法弄清楚为什么它不会自动执行此操作。我尝试使用行距选项无济于事。

/* CONTENT ********************************************************/

.content_wrapper {
    float: left; 
    width: 980px;
    margin-left: 15px;
    margin-top: 45px;

}
/* Photo Box on Home Page ************************/

.home_photo { 
        display:block;
        height: 400px;
        background: rgba(0,0,255, .5);

}

/* Text Box on Home Page */

.home_text{ 
        display:block;
        float: left;
        background: rgba(255,100,255,.5);
        height: 190px;
        text-align: left;
}

/* WRITING ***************************************/

.home_writing {
    display: block;
    background: rgba(50,50,50,.5);
    height: 1000px;
    text-align: left;
}

谢谢！

【问题讨论】：

标签： html css text styles text-align

【解决方案1】：

对于问题 #1，删除“rgba”和以下括号之间的空格，即color: rgba(255,255,255,1)。

在 Chrome 25 中，这使颜色变为白色，而不是黑色（意料之中）。如果您想要黑色，如果您出于某种原因想要指定 Alpha 通道，只需使用 color: #000; 或 color: rbga(0,0,0,1);。

对于问题 #2：段落<p> 标签的边距大约为 1em，由浏览器的默认样式表设置。将其设置为零（或其他值）以进行修改。

例子：

P { margin: 0; }

您还可以考虑使用reset stylesheet 来规范跨浏览器的行为并重置浏览器默认样式表设置的许多样式。

或者至少将所有填充/边距重置为零（这可以解决许多常见问题）：

* { padding: 0; margin: 0; }

【讨论】：

谢谢！这很有帮助。但是，我想把所有的文字都放在盒子的边缘，因为我最终会把那些花哨的颜色变成白色。所以，我想确保一切都对齐。有默认值似乎很愚蠢；是否可以使每个元素中的填充顶部都相同？类似的默认设置是否也使顶部的黑框有白色边框？谢谢！
尝试使用重置样式表（刚刚更新了我的答案），它应该摆脱最常见的默认值。在您看到它的外观之后，您就会知道需要设置哪些样式才能获得所需的布局。

【解决方案2】：

尝试更改此行

color:rgba (255,255,255,1);

到这里：

color: #000000;

【讨论】：

如果R、G、B值都由相同的数字重复组成，可以缩短为3位。即#000000变成#000，#ff3399变成#f39，等等

【解决方案3】：

对于文本颜色，删除 'rgba' 后的空格：

color:rgba(255,255,255,1);

我不完全确定我理解你的第二个问题，而不是在玩行间距。我认为您希望将段落的顶部填充和顶部边距更改为 0。

【讨论】：

就是这样 - 我没有具体说明，所以它们不应该已经是 0 了吗？
否（请参阅其他答案），并且因为您没有指定您将其留给浏览器。