Css没有更新，js添加到head或IdoSell Shop

Question

我需要更改一些由IdoSell Shop cms 制作的网上商店的样式。我需要通过编写一个将与模板的 CSS 代码组合的自定义样式文件来完成此操作。这个cms也是用Less，用的模板也是用Less写的，不过我决定用CSS.

我想通过浏览器中的控制台更改一些样式，我是这样做的：

这是我的习惯css:

.slick-prev, .slick-next {
    display: none;
}

#main_cms2 {
    margin: 0;
}

strong.price {
    color: #e35c5c;
}

@media screen and (max-width:757px)
{
    #main_cms
    {
        display: none;
    }

    #main_hotspot_zone1 h2 {
        padding-top: 1rem;
    }

    #main_hotspot_zone1 h2 .headline {
        padding: 10px 0 0 0;
    }
}

@media screen and (max-width:375px)
{

    #main_hotspot_zone1 h2 .headline {
        margin-bottom: -25px;
    }
}

@media screen and (max-width:630px)
{
    .footer_banner {
        width: 49.5%;
    }

    .footer_banners {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
}

但是没用。唯一有效的是：

strong.price {
    color: #e35c5c;
}

所以我尝试通过控制台更新样式，看看是否可行。我做了这个精简版：

var css = `.slick-prev, .slick-next {
    display: none;
}

#main_cms2 {
    margin: 0;
}

strong.price {
    color: #e35c5c;
}

@media screen and (max-width:757px)
{
    #main_cms
    {
        display: none;
    }

    #main_hotspot_zone1 h2 {
        padding-top: 1rem;
    }

    #main_hotspot_zone1 h2 .headline {
        padding: 10px 0 0 0;
    }
}

@media screen and (max-width:375px)
{

    #main_hotspot_zone1 h2 .headline {
        margin-bottom: -25px;
    }
}

@media screen and (max-width:630px)
{
    .footer_banner {
        width: 49.5%;
    }

    .footer_banners {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
}`;

var head = document.head || document.getElementsByTagName('head')[0];
var style = document.createElement('style');

head.appendChild(style);

style.type = 'text/css';
if (style.styleSheet){
  // This is required for IE8 and below.
  style.styleSheet.cssText = css;
} else {
  style.appendChild(document.createTextNode(css));
}

它在 header 中创建 <style>...</style> 标签，这个标签包含我在上面指定的 css。但它不起作用。唯一有效的是：

strong.price {
    color: #e35c5c;
}

我真的不知道哪里出了问题。

Answer 1

这不是最佳实践，我相信这个网站上的人会告诉你，但在你的类之后用 !important 属性测试它，这会告诉你是否能够直接更改 CSS，除非你能找到直接更改当前软件属性的方法，我建议首先这样做

Css没有更新，js添加到head或IdoSell Shop

Css is not updating,js adding to head or IdoSell Shop

css

content-management-system

less