看起来我的javascript中断了我的css
我在做一个小小的网络项目看起来我的javascript中断了我的css,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我在做一个小小的网络项目 我使用javascript来更改颜色-它看起来很好 我使用CSS在鼠标移动时更改颜色（：hover）-也可以 但是当我把它放在一起的时候，看起来只有javascript可以工作 <!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
：hover<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").css("color", "red");
});
});
</script>
<style>
#text:hover {
color: blue;
}
</style>
</head>
<body>
<button>Set the color property of all p elements</button>
<p id="text">This is a paragraph.</p>
<p id="text">This is another paragraph.</p>
</body>
</html>
$（文档）.ready（函数（）{
$（“按钮”）。单击（函数（）{
$（“p”）.css（“颜色”、“红色”）；
});
});
#文本：悬停{
颜色：蓝色；
}
设置所有p元素的颜色属性
这是一个段落
这是另一段
.css（）JQuery$("button").click(function(){
$("p").addClass('custom-class');
});
.custom-class{
color:red;
}
.custom类{
颜色：红色；
}
$（文档）.ready（函数（）{
$（“按钮”）。单击（函数（）{
$（“p”）.addClass（“自定义类”）；
});
});
#文本：悬停{
颜色：蓝色；
}
设置所有p元素的颜色属性
这是一个段落
这是另一段
$（文档）.ready（函数（）{
$（“按钮”）。单击（函数（）{
$（“p”）.addClass（“红色”）；
});
$（“p”）.hover（函数（）{
$（this.toggleClass（'hover'）；
});
});
#text.hover{
颜色：蓝色；
}
瑞德先生{
颜色：红色；
}
设置所有p元素的颜色属性
这是一个段落
这是另一段
！重要信息