css 定位大型 HTML 网页中的特定 div 标签

标签 css

关于我之前的 question here . 如果我使用下面的 HTML 代码作为我的网页的一部分,那里可能会有更多的 div 标签,我如何在我的 CSS 中定位这些特定的 div?我认为效果最好的示例是 [This Answer][2]。

我添加了 Id 属性以使 div 在大型 HTML DOM 中更具选择性...我不知道还有什么方法可以使它们更容易区分。如果有更好的方法,请告诉我。目标是将 CSS 设计应用于大型共享点门户网站内的大约 6 个 div 标签元素。如果有更通用的方法会很酷,这样我就可以轻松添加更多部分并在将来使用这种格式......我可以为每个我想要应用格式的元素添加一个类属性,但我不知道语法。

完成这项工作的设计师专业网络方法是什么?

<div id="projectName">
       Realtime Account Activiation
</div>

<div id="divAnnounce">
        Announcements
</div>

我有 http://jsfiddle.net/eW532/1/

我正在使用下面的代码,但结果很糟糕,整个水平长度都是蓝色的,但不是第一个字母。我试图让一个 html 元素同时使用两个类。

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .even_spacing {  color: purple;
                        background-color: #d8da3d }

        .first_letter {  background:blue;
                        color:white;
                        padding:4px 0px 4px 5px;}           
  </style>

</head>
<body>
    <form id="form1" runat="server">

    <div class="first_letter even_spacing">
        Realtime Account Activiation
    </div>

    <div class="first_letter even_spacing">
        Announcements
    </div>
    </form>
</body>
</html>

最佳答案

在 HTML 文件中放入 <LINK REL=StyleSheet HREF="Path/to/your/stylesheet.css" TYPE="text/css" MEDIA=screen>在页面顶部引用新样式表。

在你的 CSS 文件中放置:

#projectName{
style:value;
}

#divAnnounce{

}

如果您使用 .在它以类名为目标之前,

如果你需要得到具体的信息,你也可以同时使用这两者

#idname.classname{

}

如果您在 divAnnounce 中有另一个 div,您可以这样做

#divAnnounce #yournewdiv{

}

#divAnnounce div{

}

#newdivid{

}

注意两个目标之间的空间表明它们是父子

关于css 定位大型 HTML 网页中的特定 div 标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4924906/

相关文章:

javascript - 如何在点击 PrintScreen 按钮时白屏/黑屏?

html - 我可以在关键帧内的元素上指定 ID 以使用 sass 减少 CSS 吗?

css - 具有 60 像素高度和全高边框的响应式菜单

css - 使媒体导航栏在 Wordpress 网站上发挥作用

HTML/CSS : link not clickable

javascript - 将 css 模块应用于 AngularJS 的更好方法

javascript - ng-repeat 和选定的行

html - 使左右导航栏绝对化?

css - 半透明背景的滑动门技术?

html - 重新调整浏览器时,网站元素会混淆