Question

我尝试使用Container3_title类设置存在于div标签中的h2，h3，h4标签的背景。我使用此选择器但是页面中存在的所有h2，h3，h4标签都已更改。请建议

CSS：__________________________________________________

  div.Container3_title > h2, h3, h4, h5  {
            background: rgba(177, 49, 49, 0) url("images/nb-dots.png") repeat scroll 0% 0%;
        }

html：________________________________________________

<div class="Container3_body SpacingBottom">
    <div class="Container3_title">
        <h3>
            <span id="dnn_ctr428_dnnTITLE_titleLabel" class="Head">Text/HTML</span>



        </h3>
    </div>
    <hr/>
    <div id="dnn_ctr428_ContentPane"><!-- Start_Module_428 --><div id="dnn_ctr428_ModuleContent" class="DNNModuleContent ModDNNHTMLC">
    <div id="dnn_ctr428_HtmlModule_lblContent" class="Normal">
    <h3 style="text-align: center;"><span style="background-color: #fac08f;">افزودن محتوا...</span></h3>
<p style="margin-right: 40px;"><em><span style="background-color: #dbe5f1;"><br />
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</span> <span style="text-decoration: underline;"> </span></em><span style="text-decoration: underline;"> </span></p>
<h3><span style="text-decoration: underline;"><em><span style="text-decoration: underline;"><br />
</span></em></span></h3>
<span style="background-color: #00b050;"> </span><span style="text-decoration: underline;"><span style="background-color: #00b050;"> </span><em><span style="background-color: #00b050;">&nbsp;جمعه, 29 آبان 1394</span><br />
</em></span>
</div>

</div><!-- End_Module_428 --></div>
    <div class="clear"></div>
</div>
</div></div>




    <div class="row-fluid">
        <div id="dnn_leftPane" class="col-lg-8   DNNEmptyPane"></div>
        <div id="dnn_sidebarPane" class="col-lg-4 sidebar "><div class="DnnModule DnnModule-DNN_HTML DnnModule-417"><a name="417"></a>



<div class="Container7_body SpacingBottom">
<div class="Container7_title">
    <h4>
        <span id="dnn_ctr417_dnnTITLE_titleLabel" class="Head">تیتر مطلب</span>



        <span class="clip"></span>
    </h4>
</div>


    <br />
    <div id="dnn_ctr417_ContentPane"><!-- Start_Module_417 --><div id="dnn_ctr417_ModuleContent" class="DNNModuleContent ModDNNHTMLC">
    <div id="dnn_ctr417_HtmlModule_lblContent" class="Normal">
    <p>در این کتاب آموزشی با برنامه نویسی وب با Dart آشنا می شوید.<br />
این کتاب&nbsp;آموزشی محصول موسسه Apress می باشد.</p>
<p>سرفصل های کتاب:</p>
<ul>
    <li>آغاز به کار برنامه</li>
    <li>راه اندازی Dart</li>
    <li>کار با ابزارها در Dart</li>
    <li>کار با ویرایشگر در Dart</li>
    <li>بهینه سازی برای DartVM و Dartium</li>
    <li>کار با&nbsp;نرم افزار کاربردی</li>
    <li>مبانی&nbsp;Dart</li>
    <li>کار با&nbsp;اپراتورها</li>
    <li>کار با&nbsp;انواع داده ها</li>
    <li>کار با توابع</li>
    <li>استثنا در پردازش و کنترل خطا</li>
    <li>کار با کلاس Dart</li>
    <li>پیاده سازی های عمومی و Typedefs</li>
</ul>
</div>

</div>

Answer 1

问题是你的选择器。你有这个

div.Container3_title > h2, h3, h4, h5

每个逗号,代表一个新的选择器。相反，您希望将父容器中的每个标题选择器作为目标。

为此，您需要为每个容器定义容器。

div.Container3_title h2,
div.Container3_title h3,
div.Container3_title h4,
div.Container3_title h5 { 
  background: rgba(177, 49, 49, 0) url("images/nb-dots.png") repeat scroll 0% 0%;
}

您正在使用的>代表直接子选择器。

差异

.parent > .child只会选择.parent

的直接子女（一级深）

.parent .child将选择.child内的所有.parent元素。

如何为这个页面编写CSS选择器？

1 个答案: