对于这个问题，你可能还没有过相关需求，或者还没有在面试的时候被问到过，但是歪马相信你终将有需要。 这个问题说起来也是老生常谈，歪马今天再次提起也是希望有朝一日当你被问到的时候，能够答得漂亮。 听到这个的时候你一定不要盲目的说出答案。因为这么问的话，题目并不明确。所以你可以帮面试…

如果你需要——被搜索引擎索引到。谷歌不会自动索引到背景图片，否则图片搜索结果将充满雪碧图。 图片标签可以添加描述 文字（alt）和标题属性（title），这些信息可以被屏幕阅读器和搜索引擎获取。 如果你有很多图片要声明在你的 css ，浏览器将花费更长的时间去解析 css 文件…

实现一个宽高比5/1的自适应元素 其实这个等比缩放的关键在于这个.scale元素，因为他的padding-bottom具有宽高联动的效果，所以就让这个元素成为一个模具，让真正要缩放的元素装入这个模具中

在最近开发移动端页面，遇到这么一个情况：当页面宽度 100% 时，高度为宽度一半，并随手机宽度变化依然是一半。 于是我们就需要实现一个宽度自适应，高度为宽度一半的容器。 这里先以高度为宽度一半为例，也可以是其他任意比例。 这个问题类似于：我们在移动端页面，上面有一张宽度 100…

最近在开发H5时又再次遇到了需要对图片等比缩放的需求。想着这也是自己以前刚开始工作时遇到困难之一，因此就记录了一下。希望能对有需要的小伙伴有所帮助吧。

本文基于CSS Compat 2021和Interop 2022中部分特性，对名词概念进行介绍说明，并根据特性和属性值介绍附加实际中的使用场景和浅显demo。

需求描述 页面中有一个图片，页面宽度变小（比如打开控制台，拖动边栏），图片宽高，要随之等比例自适应缩放，如下效果图 效果图 实现方案 方案一：使用宽度百分比和vw 方案二：宽度百分比加高度被paddi

开发时候经常会用到在div中直接使用background-image的方式将图片作为背景图片放置，如果这时候需要做一个鼠标Hover上去时平滑放大一点，移开又平滑恢复原状的效果，就需要借助backgo