根据元素的宽度更改 CSS

  • 本文关键字:CSS 元素 html css styles
  • 更新时间 :
  • 英文 :


是否有一种纯CSS方法可以为元素指定不同的CSS样式,只有当元素在一定宽度下时才有效?

类似于@media查询,但不是整个屏幕,只是元素。类似。。。

.element {background: blue;}
.element[max-width=300] {background: red;}

我知道如何使用JavaScript,但这听起来太复杂了…><

媒体查询只能在设备屏幕的大小上工作,即在查看网站的媒体上。因此,不幸的是,CSS无法做到这一点。

JavaScript听起来可能是一种复杂而过分的方法,但它将是最好、最高效、最可维护的方法。如果你在一个页面上使用很多元素,你甚至可以考虑使用React或Angular之类的东西。对于小的东西来说,这些将是非常过分的,但如果你在更大的范围内这样做,会使维护和工作更容易。

如果你能计算出这些特定元素的大小在你想要更改的大小下整个屏幕的大小,你可以尝试使用媒体查询。这可能比JavaScript更复杂,可能会使维护更加复杂。

相关内容

  • 没有找到相关文章

最新更新