当前位置: 首页 > 知识库问答 >
问题:

前端 - 媒体查询中的特征值支持变量吗?

屠华辉
2024-08-21

例如 @media screen and (min-width: 768px){} 中的 768px 需要是一个变量,但是发现如果使用 css 的自定义属性是不支持的, min-width: var(--xs)。目前使用的是 scss 等预处理器。css 目前来看不考虑兼容性有对这方面的支持吗?

共有2个答案

翟博雅
2024-08-21

试试vue命令v-bind

<script>
const px = '750px'
</script>

<style lang="scss">
.a{
@media screen and (min-width: v-bind(px)){
}
}
</style>
鲁辉
2024-08-21

查了下规范,媒体查询确实不支持变量,楼主可以考虑下用clamp能否实现相同效果:https://developer.mozilla.org/zh-CN/docs/Web/CSS/clamp,clamp是支持变量的

 类似资料:
  • 问题内容: IE8是否不支持以下CSS媒体查询: 如果没有,替代的写作方式是什么?在Firefox中也可以正常工作。 下面的代码有问题吗? 问题答案: IE9之前的Internet Explorer版本 不支持媒体查询 。 如果您正在寻找一种 降低 IE8用户设计水平的方法,则可能会发现IE的条件注释很有用。使用此功能,可以指定特定于IE 8/7/6的样式表,该样式表将覆盖以前的规则。 例如: 这

  • 问题内容: 我正在使用iPad专用的网站。为了使我的网站在视网膜显示屏iPad和旧版本的iPad上都能正常工作,我想在媒体查询中的LESS CSS中设置一个变量,例如: 因此,当您以像素为单位设置任何内容时,您都可以 但是我收到一个编译错误,指出未定义@ratio。是否有解决方法才能使其正常工作?谢谢。 问题答案: 很好,但这是不可能做到的。 LESS将您的媒体查询编译为实际的媒体查询,因此在编译

  • 问题内容: 我正在尝试在媒体查询中使用CSS变量,但它不起作用。 问题答案: 从规格, 该函数可以代替元素上任何属性中值的任何部分。该函数不能用作属性名称,选择器或除属性值之外的其他任何东西。(这样做通常会产生无效的语法,否则将产生其含义与变量无关的值。) 所以不,您不能在媒体查询中使用它。 这是有道理的。因为您可以将例如设置为,即元素,然后从那里继承其他元素。但是媒体查询不是元素,它也不继承自,

  • 期望: 1. 定义: 设离散型随机变量$$X$$的分布律为:$$P{X=x_i}=p_k, k=1,2,...$$,若级数$$\displaystyle\sum_{k=1}^{\infty} x_k p_k$$绝对收敛,则称该级数的和为随机变量$$X$$的数学期望(mean),记为$$E(X)$$。即 $$ E(X)=\displaystyle\sum_{k=1}^{\infty} x_k p_k

  • 主要内容:1. 媒体类型,2. 媒体特性,3. 逻辑操作符,4. 定义媒体查询随着移动设备的快速普及,用户不再只是通过传统的电脑系来浏览 Web 内容,越来越多的用户开始使用各种尺寸的智能手机、平板电脑或者其它设备来浏览 Web 内容,为了确保使用不同设备的用户都能拥有不错的体验就需要用到媒体查询。 媒体查询是 CSS 样式表最重要的功能之一,所谓媒体查询指的就是根据不同的媒体类型(设备类型)和条件来区分各种设备(例如:电脑、手机、平板电脑、盲文设备等),并为它们分别定义不