CSS - 李

Question

顯示背景圖片我想顯示定製的圓形裏內的圖像。我只想在那裏展示一個成功的刻度圖。我有一個CSS爲 -

span.round-tabs { 
 
    width: 50px; 
 
    height: 50px; 
 
    line-height: 50px; 
 
    display: inline-block; 
 
    border-radius: 100px; 
 
    background: white; 
 
    z-index: 2; 
 
    position: absolute; 
 
    left: 0; 
 
    text-align: center; 
 
    font-size: 25px; 
 
} 
 

 
li.success span.round-tabs.one { 
 
    background-image: url('img/if_Tick_Mark_Dark_1398912.png'); 
 
} 
 

 
 
<li class="success"> 
 
    <a href="#" aria-controls="home" id="DivPatientDetails" name="PatientDetails" > 
 
     <span class="round-tabs one"> 
 
      <i class="icon icon-profile-male"></i>01 
 
      <h4>Patient's Details</h4> 
 
     </span> 
 
    </a> 
 
</li>

但我得到的結果爲：

代替：

我在這裏錯過了什麼？

Answer 1

要麼使用

background-position: center center;

，或者使用

background-position-y或background-position-x到圖像正確地定位。

那麼你可能想以確保尺寸正確使用CSS的background-size規則。如果你張貼了一個jsfiddle，我很樂意將這個解決方案應用到你看到的。