Question

大家好我真的无法弄清楚为什么我<ul>上的图像无法正常工作。

我需要使用类来设置ul的样式，但<li>看起来保持相同。这是我的css代码：

body{padding:0;margin:0;  background:#39424b; font-family: verdana;}
h1, h2{padding:0;margin:10px 0 10px 0;}
h1 {font-size: 150%;}
h2 {font-size: 110%;}
p{padding:0; margin:0 0 5px 0;}
a {color:#176092; text-decoration:none;}
a:hover {text-decoration:underline;}
#wrap {width:960px; margin: 0 auto; background:#999;}
#header, #footer {background: #0f1923; color:#fff; padding:10px 40px;}
#footer p {font-size:80%; text-align:right;}
#content {background:#ccc; padding:10px 40px;}
pre {font-size:85%; background:#fff; border:1px #ccc solid; padding:5px}
#checkjul ul {
list-style-image: url('http://dorchdanola-netbutik.dk/Resources/Files/general/checkbox-jul.png');
padding-left: 25px;
margin-bottom: 10px;
height: 19px;
}

#slide-out-div-jule-holder {
width: 600px;
height: 270px;
margin: 20px;
margin-top: 10px;

这是我的HTML代码：

 <div class="slide-out-div">
        <a class="handle" href="http://link-for-non-js-users">Julehandel</a>
        <div style="float:left" class="slide-out-div-jule-holder">
       <b>K&oslash;b julegaver hos Dorch & Danola<br /> - Nemt, Sikkert og billigt!</b>
       <ul class="checkjul"><li>E-m&aelig;rket kontrolleret webshop for sikker handel</li>
      <li>Vi bytter alle ordre k&oslash;bt fra 20. oktober frem til og med den 15. januar 2015</li> 
        <li>Gratis ombytning af Julegaver - Vi sender returlabel </li>
       <li> Sidste bestillingsdato for julegaver er den 22. december.</li>
       <li> Hurtig levering - Fragt fra Kr. 39,-</li> 
      <b>Dorch & Danola &oslash;nsker alle en gl&aelig;delig jul og et rigtig godt nyt&aring;</b></ul>
    </div></div>

Answer 1

所以它不起作用，因为你正在塑造#checkjul ul，但你没有这样的元素。所以要工作，你需要将这些样式添加到ul类.checkjul，它将起作用：）

＆＃13;

 body {
   padding: 0;
   margin: 0;
   background: #39424b;
   font-family: verdana;
 }
 h1,
 h2 {
   padding: 0;
   margin: 10px 0 10px 0;
 }
 h1 {
   font-size: 150%;
 }
 h2 {
   font-size: 110%;
 }
 p {
   padding: 0;
   margin: 0 0 5px 0;
 }
 a {
   color: #176092;
   text-decoration: none;
 }
 a:hover {
   text-decoration: underline;
 }
 #wrap {
   width: 960px;
   margin: 0 auto;
   background: #999;
 }
 #header,
 #footer {
   background: #0f1923;
   color: #fff;
   padding: 10px 40px;
 }
 #footer p {
   font-size: 80%;
   text-align: right;
 }
 #content {
   background: #ccc;
   padding: 10px 40px;
 }
 pre {
   font-size: 85%;
   background: #fff;
   border: 1px #ccc solid;
   padding: 5px
 }
 .checkjul{
   list-style-image: url('http://dorchdanola-netbutik.dk/Resources/Files/general/checkbox-jul.png');
   padding-left: 25px;
   margin-bottom: 10px;
   height: 19px;
 }
 #slide-out-div-jule-holder {
   width: 600px;
   height: 270px;
   margin: 20px;
   margin-top: 10px;
 }

＆＃13;

<div class="slide-out-div">
  <a class="handle" href="http://link-for-non-js-users">Julehandel</a>
  <div style="float:left" class="slide-out-div-jule-holder">
    <b>K&oslash;b julegaver hos Dorch & Danola<br /> - Nemt, Sikkert og billigt!</b>
    
    <ul class="checkjul">
      <li>E-m&aelig;rket kontrolleret webshop for sikker handel</li>
      <li>Vi bytter alle ordre k&oslash;bt fra 20. oktober frem til og med den 15. januar 2015</li>
      <li>Gratis ombytning af Julegaver - Vi sender returlabel</li>
      <li>Sidste bestillingsdato for julegaver er den 22. december.</li>
      <li>Hurtig levering - Fragt fra Kr. 39,-</li>
      <b>Dorch & Danola &oslash;nsker alle en gl&aelig;delig jul og et rigtig godt nyt&aring;</b>
    </ul>
    
  </div>
</div>

＆＃13;

Answer 2

你有

<ul class="checkjul">

但是您将样式定义为ID，并将其应用于错误的元素：

#checkjul ul

为此，您需要：

.checkjul li

Css样式<ul>无法正常工作</ul>

2 个答案: