为什么屏幕文字颜色不随屏幕的大小变化
来源：3-23 编程练习
努力1下一站
2019-04-20 14:55:00
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
p{
color:red;
text-align:center;
}
/*此处写代码*/
@media screen and(min-width:1100px){
body{
color:red;
}
}
@media screen and(min-width:960px)and(max-width:1099px){
body{
color:orange;
}
}
@media screen and(min-width:800px)and(max-width:959px){
body{
color:yellow;
}
}
@media screen and(min-width:750px)and(max-width:799px){
body{
color:green;
}
}
@media screen and(min-width:600px)and(max-width:749px){
body{
color:cyan;
}
}
@media screen and(min-width:450px)and(max-width:599px){
body{
color:blue;
}
}
@media screen and(max-width:499px){
body{
color:purple;
}
}
</style>
</head>
<body>
<p>
我的颜色会随着屏幕大小的变化而变化。
</p>
</body>
</html>
1回答
-
Miss路
2019-04-20
同学，你好。
两个问题：
1、语法不对，and前后都是需要有空格的：
2、连改变字体颜色的时候要用p选择器，不能给body设置，因为p标签本身是有默认样式的，要比body给他的颜色优先级要高，所以不会改变颜色，，还有一种方法，可以不用改body，但是下面不要用p标签，可以改成div也是可以的。
如果帮助到了你，欢迎采纳！
祝学习愉快！
0
相似问题