jQuery将css附加到头部

时间:2018-10-19 02:30:36

标签: jquery css

我想学习一些jQuery,并尝试从简单的东西开始(或者我一直以为是这样),我试图用一些CSS来更改某些div样式,但是它似乎没有用。
关于我在做什么错的任何想法吗?

$('head').append('<style type="text/css"> #main1, #main2 { 
background-image: linear-gradient(to right, #92FE9D, #00C9FF) !important;
color: #000000 !important;
border-radius: 4; } 
</style>');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="main1">1</div>
<div id="main2">2</div>

3 个答案:

答案 0 :(得分:0)

您需要连接新行,例如:

$('head').append('<style type="text/css"> #main1, #main2 {'+
'background-image: linear-gradient(to right, #92FE9D, #00C9FF) !important;'+
'color: #000000 !important;'+
'border-radius: 4; }'+
'</style>'); 

答案 1 :(得分:0)

如果要使用CSS更改某些css属性,则需要这样做,例如:

$("p").css("background-color", "yellow");

答案 2 :(得分:0)

使用两个反引号将CSS放入模板字符串中:

var css = `
<style type="text/css"> 
    #main1, #main2 { 
        background-image: linear-gradient(to right, #92FE9D, #00C9FF) !important;
        color: #000000 !important;
        border-radius: 4; 
    } 
</style>`;

$('head').append(css);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="main1">1</div>
<div id="main2">2</div>