Css取决于屏幕尺寸[重复]

Posted 2023-03-06

技术标签:

【中文标题】Css取决于屏幕尺寸[重复]【英文标题】：Css depending on screen size [duplicate] 【发布时间】：2017-04-30 20:39:08 【问题描述】：

我尝试根据屏幕大小改变CSS，我尝试用一个简单的例子来理解原理，除了它对我不起作用，这是我的代码。

    @media (max-width: 800px) 
       p
      	color: red;

    <head>
    	<title>Css depending on screen size</title>
    	<link rel="stylesheet" type="text/css" href="style.css">
    </head>
    <body>
    <p>This is a test paragraphe</p>
    </body>

感谢您的帮助

【问题讨论】：

这是一个非常广泛的问题，看起来您的 CSS 并没有错。您是否尝试过很棒的在线教程之一，例如this MDN one？你的例子工作得很好（至少对我来说）当我更改屏幕尺寸时，我希望文本颜色为红色，但没有任何反应。看here一切正常它工作正常... 【参考方案1】：

要工作规则@media 添加部分<head>：

<meta name="viewport" content="height=device-height, width=device-width, initial-scale=1">

【讨论】：

只有这还不够，他还需要媒体查询知识以及如何有效地使用它们谢谢，这解决了问题

以上是关于Css取决于屏幕尺寸[重复]的主要内容，如果未能解决你的问题，请参考以下文章