微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何在Mobile Res上更改字体颜色

如何解决如何在Mobile Res上更改字体颜色

我很难在网站上解决此小问题,因此正文文本在桌面上显示为白色,这很好,但是当我使用较小的设备时,我不想显示该文本白色,因为它会随着白色背景而塌陷,并且您无法阅读文字。如何使用CSS或HTML将其更改为移动版本的另一种颜色?

This Is How It Shows On Desktop

This Is How It Shows On Smaller Screens (Phones,Tablets,etc)

从Stackoverflow进行的编辑(无效)

CSS:

@media only screen and (max-width: 600px) {
    .mob1 {
     color: #ffffff;
   }
  }
  
@media only screen and (min-width: 600px) {
    .mob1 {
     color: #000000;
   }
  }

HTML:

<p style="color: aliceblue;" class="custom-article wow fadeInDown" data-wow-delay=".2s"><span class="mob1">Changed Text</span></p>
  • 我试图将mob1添加到p类中,也没有用。

解决方法

尝试使用媒体查询。

@media only screen and (max-width: 600px) {
  body {
    background-color: lightblue;
  }
}

有关更多详细信息:https://www.w3schools.com/css/css_rwd_mediaqueries.asp

,

尝试

在html文件上,如果它是p元素,或者是任何类型的文本元素,

<p class="colourTest">TEXT</p>

in the css file: 

//for screens smaller then mobile
@media only screen and (max-width: 600px) {
  .colourTest {
   text-color: black;
}
}

//for screens bigger then mobile
@media only screen and (min-width: 600px) {
  .colourTest {
   text-color: white;
}
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。