当前位置:首页 > css > 正文内容

移动端项目在sass中使用@2x@3x图

hxing6412年前 (2022-06-17)css4962
@mixin bg_image($url) {
background-image: url($url+".png");
background-size: 100% 100%;
@media (-webkit-min-device-pixel-ratio: 3), (min-device-pixel-ratio: 3) {
background-image: url($url+"@2x.png");
}
}
//使用
@include bg-image('你图片地址');


扫描二维码推送至手机访问。

版权声明:本文由星星博客发布,如需转载请注明出处。

本文链接:http://xingxinghan.cn/?id=392

分享给朋友:
返回列表

没有更早的文章了...

下一篇:CSS垂直居中的实现方法与总结

“移动端项目在sass中使用@2x@3x图” 的相关文章

CSS垂直居中的实现方法与总结

在前端开发中,经常会遇到需要将元素在页面中垂直居中的情况。垂直居中是一个常见的布局需求,特别是在响应式设计中,确保页面的可读性和可访问性。然而,实现垂直居中并不总是那么容易,因为在 CSS 中没有直接的属性可以轻松地实现这一效果。本文将总结一些常用的 CSS 垂直居中方法,并介绍它们的优缺点。方法一...

CSS选择器详解,常用选择器

CSS选择器是在网页开发中用于选择元素并应用样式的重要工具。了解不同类型的选择器以及它们的用法和特点,可以帮助我们更好地控制和定位页面中的元素。本文将详细介绍常用的CSS选择器,包括基本选择器、属性选择器和伪类选择器,并提供相应的代码示例。基本选择器 基本选择器是最常用和最简单的选择器类型。它们通过...

CSS超出省略号实现

1. 实现CSS单行超出省略号.container {   white-space: nowrap; /* 强制在一行中渲染文本 */   overflow: hidden; /*&nb...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。