是时候让我跟上现代 CSS 的速度了。
CSS 中有很多新东西我知道的太少了。
为了改变这一点,我开始了#现代CSS100天。
为什么或多或少现代 CSS?
因为有些主题将是关于尖端功能的,而其他主题已经存在了很长一段时间,但我对此几乎没有经验。
该max()
函数采用逗号分隔的表达式列表。将选择列表中的最大值。
div { width: max(400px, 200px, 300px); /* width = 400px */}
这个例子没有多大意义,因为值总是400px
.max()
当你使用相对单位时,它会显示出它的真正力量。
div { width: max(300px, 50vw);}
如果50vw
小于 300px,则width
匹配300px
. 如果50vw
大于 300px,则匹配50vw
. 这基本上是一个较短的版本。
div { min-width: 300px; width: 50vw;}
PS:下一篇文章是在周一发布,因为周末是给家人和朋友的。❤️