Question

我正在帮助创建一个网站，我们是两个人在这个项目上工作。另一个人负责视觉部分（CSS，html和javascript），我负责网站的内部功能（php，javascript和数据库......）。

我为网站弹出错误消息创建了一个代码。

我使用了一些css来创建弹出的月经，当我使用内部样式表时，我无法工作。

当我使用外部样式表时出现问题，弹出效果不起作用。

我做了一些研究，发现这可能是由编码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：sudo chown -R username /.../.../.../.../ css

如果一切正常并且某些文件无法加载，请检查文件权限。

为什么内部样式表有效，而外部样式表不适用于

1 个答案: