引導模態是透明的 - 不透明度不工作

Question

我與引導和情態動詞的ATM工作，不知道我做錯了什麼

http://i.stack.imgur.com/HCKnC.png

正如你所看到的情態動詞的內容是透明的，它不看起來不錯...
那麼我能做些什麼呢？

<div id="changeRPGNameModal" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-hidden="true"> 
    <div class="modal-dialog modal-sm"> 
     <div class="modal-content"> 
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
       <span aria-hidden="true">&times;</span> 
      </button> 
      <h4 class="modal-title">Name ändern:</h4> 
     </div> 
     <div class="modal-body"> 
      <div class="form-group"> 
       <label for="inputRPGName">Name</label> 
       <input type="text" class="form-control" id="inputRPGName" 
         placeholder="Gib einen neuen Namen ein" autofocus/> 
      </div> 
      <div class="containerButtons"> 
       <button class="floatLeft btn btn-default btn48Percent" data-dismiss="modal">Abbrechen</button> 
       <button class="floatRight btn btn-success btn48Percent" data-dismiss="modal" id="buttonChangeRPGName">Ändern</button> 
      </div> 
      <div class="clear"></div> 
     </div> 
    </div> 
</div> 

我已經嘗試設置不透明度.modal-背景（.fade.in），但如果我這樣做，我的屏幕的整個背景變白
http://i.stack.imgur.com/zhqbU.png

Answer 1

你去那裏，你它使加載模態的身體和Opacity not working以外內容的內容加載之前已經關閉<div class="modal-content">，我還添加了<div class="modal-content">模態稱號。

<div id="changeRPGNameModal" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-hidden="true"> 
<div class="modal-dialog modal-sm"> 
    <div class="modal-content"> 
     <div class="modal-header">    
       <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
        <span aria-hidden="true">&times;</span> 
       </button> 
       <h4 class="modal-title">Name ändern:</h4> 
     </div> 
     <div class="modal-body"> 
      <div class="form-group"> 
       <label for="inputRPGName">Name</label> 
       <input type="text" class="form-control" id="inputRPGName" 
         placeholder="Gib einen neuen Namen ein" autofocus/> 
      </div> 
      <div class="containerButtons"> 
       <button class="floatLeft btn btn-default btn48Percent" data-dismiss="modal">Abbrechen</button> 
       <button class="floatRight btn btn-success btn48Percent" data-dismiss="modal" id="buttonChangeRPGName">Ändern</button> 
      </div> 
      <div class="clear"></div> 
     </div> 
    </div> 
</div> 
</div>  
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#changeRPGNameModal">Open Modal</button> 

Working Fiddle