object-fit
发表于|更新于
|浏览量:
能轻易做到别人感觉困难的事是人才;能轻易做到别人所不能做的工作是天才。——西德尼
讲一个小技巧,对于图片裁剪可以用这个属性:object-fit
object-fit 是一个 CSS 属性,用于指定替换元素(如 <img> 和 <video>)内容的尺寸如何适应其容器。它定义了内容如何填充容器的大小,以及是否保持内容的比例
例如:
1 | <div style="width: 400px; height: 400px; overflow: hidden;"> |
相关推荐
2021-12-11
jq eq
要知道对好事的称颂过于夸大,也会招来人们的反感轻蔑和嫉妒。——培根 我们使用jquery选择器时如果有多个结果,我们可以使用eq函数选择指定下标的元素 例如此处 1234567891011121314151617<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="https://www.jq22.com/jquery/jquery-3.3.1.js"></script> </head> <body> <div class="ruben">vampire</div> <div class="ruben">ruben</div> <script type="text/javascript"&...
2022-09-21
three.js
阿谀奉承而无所图的人极少;爱奉承的话,就免不了要付出代价——佚名 一个js的3D库 git仓库:https://github.com/mrdoob/three.js 官网:https://threejs.org/ 其中包含了很多案例 甚至有用它做游戏:
2023-06-07
image-conversion
失之毫厘,差之千里。——佚名 分享一个js图像库: https://github.com/WangYuLue/image-conversion Install12345npm i image-conversion --save# or yarn add image-conversion Include the libraryin browser: 1<script src="https://cdn.jsdelivr.net/gh/WangYuLue/image-conversion/build/conversion.js"></script> in CommonJS: 1const imageConversion = require("image-conversion"); in ES6: 1import * as imageConversion from 'image-conversion'; or 1import {compress, compressAccurat...
2021-05-19
jq获取实时宽度
乐观使你倾向于幸福健康事业顺利,悲观使你倾向于绝望患病失败忧郁孤独懦怯——民谚 代码如下 12345$(window).resize(() => { var height = $(window).height(); var width = $(window).width(); console.log(height+" "+width)}); 然后当我窗口大小发生变化时就会触发
2025-11-22
playcanvas-engine
生活就像一盒巧克力,你永远不知道下一颗是什么味道。——阿甘·弗雷斯 PlayCanvas Engine 深度观察:在浏览器原生跑起来的开放式 3D/WebXR/WebGPU 游戏引擎 仓库地址:playcanvas/engine描述:Powerful web graphics runtime built on WebGL, WebGPU, WebXR and glTF官网:PlayCanvas 网站 | 用户手册 | API Reference | 在线示例 | 官方博客(这些入口均在 README 顶部有导航)许可证:MIT语言:JavaScript / TypeScript(脚本可二选一)核心技术关键字(源自仓库 Topics):webgl webgl2 webgpu webxr gltf game-engine gaussian-splatting 等 PlayCanvas Engine 是一个完全开源、浏览器原生运行的实时 3D / 游戏 / 交互内容引擎。它的定位并不是“另一个封装层”,而是一套将现代 W...
2020-09-07
常用正则
我发现,一个人在放弃给别人留好印象的负担之后,原来心里会如此踏实。——严歌苓 分享一点常用正则 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185...
