在手机上调整文本行（div）

Question

有人知道要为移动设备调整文本大小吗？我的CSS不起作用。

<div class="wpb_column wpb_content_element how-it><div class="wpb_wrapper"> 
<h1 class="p1" style="text-align: center;"><span style="font-size: 45px;"> 
<span style="color: #000000;">SLIK FUNGERER ABONNEMENTET</span></span></h1></div></div> 

CSS：

所有的

@media (max-width: 360px) { 
.how-it h1 {font-size: 16px; !important;} 
} 

Answer 1

首先阅读https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity要学会根据特定的规则是如何应用CSS。

对于特定问题，您无法通过更改后代元素来覆盖直接应用于元素的样式。您需要定位与样式相同的元素。

所以针对span元素.how-it h1 span{font-size: 16px; !important;}

但更正确的方法是，从HTML完全删除的样式，并通过CSS规则做移动和桌面风格。通过这种方式，您可以避免使用!important，这只会在您想根据其他情况对其进行重新设置时引发更多问题。