CSS加载微调器不能从style.css

时间:2018-04-24 00:47:13

标签: html css bootstrap-modal

我一直在讨论这个问题,我确定答案很简单,但你知道编码是怎么回事。

我正在尝试从我的style.css文件中运行一个css加载微调器。 所以我把它放在模态的顶部我想在...中使用微调器

<head>
<link rel="stylesheet" href="<?php echo ABSPATH; ?>/content/templates/dashboard/css/style.css" />
<link rel="stylesheet" href="<?php echo ABSPATH; ?>/content/templates/dashboard/css/style-mobile.css" />

然后,我已经安排了div

<div class="cssloader-overlay"> 
        <div class="cssloader-container">
            <div class="cssload-whirlpool"></div>
        </div>
    </div>

这是样式表中的一个片段

.cssloader-container {
    position:absolute;
    top: 50%;
    left: 50%;
    display:none;
}

.cssloader-overlay {
    position: fixed;
    width: 100%;
    height:100%;
    display: flex;
    align-items: center;
    background: rgba(0, 0, 0, 0.2);
    top: 0;
    left: 0;
    display:none;
}

.cssload-whirlpool,
.cssload-whirlpool::before,
.cssload-whirlpool::after {
    position: absolute;
    top: 50%;
    left: 50%;
    border: 1px solid rgb(255,255,255);
    border-left-color: rgb(230,0,0);
    border-radius: 974px;
        -o-border-radius: 974px;
        -ms-border-radius: 974px;
        -webkit-border-radius: 974px;
        -moz-border-radius: 974px;
}

目前我的微调器只有在我将css放在实际模态中的样式元素中时才有效。当我尝试从style.css文件运行它时,它不起作用。有谁知道我做错了什么?

1 个答案:

答案 0 :(得分:0)

将其放在您<head>之前。

<link rel="stylesheet" href="/content/templates/dashboard/css/style.css">

我不知道你是否尝试过这个,但听起来这就是问题/解决方案。