爲什麼內部樣式表工作而外部樣式表不能？

Question

我正在幫助創建一個網站，我們是在這個項目上工作的兩個人。另一個人負責視覺部分（CSS，html和javascript），我負責網站的內部功能（php，javascript和數據庫......）。

我爲網站創建了一個代碼彈出錯誤消息。

我用一些css來創建彈出式的mensage，當我使用內部樣式表時我不工作。

問題是當我使用外部樣式表時，彈出效果不起作用。

我做了一些研究，發現這可能是由編碼的CSS造成的。

因此，要解決這個問題，我這樣做：

在我mystyle.css：

@charset "utf-8"; 

在我head.php：

<meta charset="utf-8"> 

但這並沒有解決我的問題。

我做了一些更多的研究，並有可能是由於在錯誤的地方獲取外部CSS而導致的。

我認爲這不是由於其他人的CSS正在工作造成的。我正在將我的css保存在同一個文件夾中，因爲其他人正在保存她的文件夾。我把這個css文件和其他人一樣。

我head.php：

<link rel="stylesheet" href="<?php echo $base_url;?>/css/bootstrap.css"> 
<link rel="stylesheet" href="<?php echo $base_url;?>/css/mystyle.css"> 

什麼導致這個，還是我做錯了什麼？

我的外部樣式表的完整代碼。

mystyle.css：

@charset "utf-8"; 

     .modal-error-box { 
      display: none; /* Hidden by default */ 
      position: fixed; /* Stay in place */ 
      z-index: 1; /* Sit on top */ 
      padding: 200px 0px 100px 0px; 
      left: 0; 
      top: 0; 
      width: 100%; /* Full width */ 
      height: 100%; /* Full height */ 
      overflow: auto; /* Enable scroll if needed */ 
      background-color: rgb(0,0,0); /* Fallback color */ 
      background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ 
     } 


     /* The Close Button */ 
     .close{ 
      color: black; 
      float: right; 
      font-size: 28px; 
      font-weight: bold; 
     } 

     .close:hover, 
     .close:focus { 
      color: #000; 
      text-decoration: none; 
      cursor: pointer; 
     } 

     .modal-error-box-header{ 
      margin: auto; 
      width: 35%; 
      height: 5%; 
      border: 3px solid black; 
      background-color: Red; 
      color: Black; 
     } 

     .modal-error-box-body 
     { 
      margin: auto; 
      width: 35%; 
      height: 20%; 
      border: 3px solid black; 
      text-align: center; 
      background-color: white; 
      color: Black; 
      overflow: scroll; 
     } 

HTML：

<div id="erro-gravar-operacoes" class = "modal-error-box"> 
     <div id ="error-gravar-header1" class = "modal-error-box-header"> 
      Mensagem de ERRO: 
      <span id="close-erro1" class="close">&times;</span> 
     </div> 
     <div id = "erro-gravar-body1" class="modal-error-box-body"> 
     </div> 
</div> 

的javascript：

function validatesubmitform(id_var) 
{ 

    //validate form. 

    if(validate == false){ 

        var div_error = document.createElement("p"); 
        div_error.setAttribute('id', "id_element_erro"); 
        if(text_erro!="") 
        { 
         var element_erro = document.createElement("p"); 
         element_erro.setAttribute('id', "id_element_erro1"); 
         var texto_erro = document.createTextNode(text_erro); 
         element_erro.appendChild(texto_erro); 
         div_error.appendChild(element_erro); 

        } 
        if(text_erro1!="") 
        { 
         var element_erro1 = document.createElement("p"); 
         element_erro1.setAttribute('id', "id_element_erro2"); 
         var texto_erro1 = document.createTextNode(text_erro1); 
         element_erro1.appendChild(texto_erro1); 
         div_error.appendChild(element_erro1); 
        } 
        var div_display = document.getElementById("erro-altera-body2"); 
        div_display.appendChild(div_error); 
        document.getElementById("erro-altera-operacoes").style.display='block';  
     } 
     return validate; 

} 

幫助解決這個問題確實是必要的，不勝感激。

預先感謝未來對解決此問題的貢獻。要做到這一點

Answer 1

一種方法是給自己的寫權限在css文件夾

Ubuntu的：須藤喬敦 - R的用戶名/.../.../.../.../css

如果一切似乎都很好，並且某些文件無法加載，請檢查文件權限。