語義UI模態背景​​圖片

Question

語義UI模態可以有背景圖片嗎？

<modal ng-model="dc.show_leaderboard" class="leaderBoard"> 
    <i class="close icon" ng-click="dc.close_modal()"></i> 
    <div class="header">Header</div> 
</modal> 

CSS：

.leaderBoard{ 
    background: url('/assets/images/0011mainBG_SmallRobotBG_overlay1364x768.png') no-repeat !important; 
    width: 200px; 
    left: 90%; 
    text-align: center; 
    color: white; 
} 

Answer 1

的文檔中未引用，但是一個模型可以

1. 包含圖像內容
2. 變化在大小
3. 使用的整個大小屏幕

http://semantic-ui.com/modules/modal.html#/definition

但是，一些CSS定製，我們可以

你可以試試這個圖像背景

<style> 
    .modal { 
    background:url('Your path to image') !important; 
    width:200px !important; 
    } 
</style> 
    <div class="ui view modal inverted " > 
     <div class="header" style="background:none;">User Deletion ?</div> 
      <div class="content" style="background:none;"> 

      <p><?php echo __('Are you sure you want to delete ?'); ?></p> 
     </div> 
    <div class="actions" style="background:none;"> 
     <div class="ui cancel button">Cancel</div> 
     <div class="ui approve button">OK</div> 
    </div> 
</div> 

要使用彩色背景：

 <div class="ui view modal red inverted segment" > 
      <div class="header" style="background:none;">User Deletion ?</div> 
      <div class="content" style="background:none;"> 
      <p><?php echo __('Are you sure you want to delete ?'); ?></p> 
     </div> 
     <div class="actions" style="background:none;"> 
     <div class="ui cancel button">Cancel</div> 
     <div class="ui approve button">OK</div> 
     </div> 
    </div>