在 CSS 开发中,一些简单的一行代码往往可以让你的页面变得更加优雅高效。以下是 10 个我喜欢使用的 CSS 一行代码,它们不仅简洁,还能在实际项目中起到很大的作用。1 设置宽高比例(Aspect Ratio)通过 aspect-ratio 属性,可以根据指定的宽度自动调整高度(反之亦然)。
一般情况下,pc版和手机版的切换,比如在网站底部搞个按钮,手机下显示pc版,pc下显示手机版,这种都不是响应式,而是手机一套模板,pc一套模板。响应式不用这个,它是自适应的。但是,客户不懂啊,非要在手机下能切换到pc看效果
inset是top、left、right、bottom的一个简写方式。insert对非静态定位的元素不会生效,也就是只有设置position被设置的时候生效,这就和top之类一样。
env()和constant(),是IOS11新增特性,Webkit的css函数,用于设定安全区域与边界的距离,有4个预定义变量
css3设置字体颜色渐变的三种方法,在web前端开发过程中,UI设计师经常会设计一些带渐变文字的设计图,在以前我们只能用png的图片来代替文字,今天可以实现使用纯CSS实现渐变文字了
今天,我爱模板网在element-plus中,使用原生的radio单选框,发现都不显示,F12一查看,发现宽高都是0,强制设置宽高也没用。但也没看到哪里设置了宽高,然后就发现了-webkit-appearance:none的样式,把它取消了或者设置为非none的值,就显示了。
noise 本身有不同的颜色,但现在它是单色的,因为我们对父元素应用了一些滤镜,这也会影响伪元素。尽管如此,我们仍然可以应用额外的滤镜(不是必需的)和混合模式以更好地与原始图片混合。我强烈建议使用不同的 mix-blend-mode 值:darken 和 multiply 产生我们想要的效果的很好的结果。
它还能查询系统使用的是深色模式还是浅色模式,即prefers-color-scheme,css 媒体特性,用于检测用户是否有将系统的主题色设置为亮色或者暗色。 在过去,必须手动切换主题色,写两套css,然后通过js来切换。