请在Chrome、Firefox等现代浏览器浏览本站。网站域名:森林之家(www.foresthouse.cn)爱学习、爱分享、爱绿软、爱恐怖、爱音乐、爱唠叨、爱折腾、爱生活!

css图片原图按比例缩放多余隐藏

心得笔记 forest 17℃ 未收录 0评论
例如一张宽度为1000像素的图片我想要从中间开始等比绽放到100像素,然后左边和右边超出来的部分隐藏,得到我想要的按比例缩放图片效果。代码如下:
<div style="width:500px;overflow:hidden;display:flex;justify-content:center;align-items:center;">
<img src="1.jpg"/>
</div>

上面的代码是将一张图片的宽度设定为500像素超出来的左右等比隐藏。效果图如下:

css图片原图按比例缩放多余隐藏
演示页面打开预览

本站文章如未注明,均为原创丨本网站采用BY-NC-SA协议进行授权,转载请注明转自:https://www.foresthouse.cn/archives/5870.html
喜欢 (0)or分享 (0)
发表我的评论(注:在您评论完以后不会立即显示,请不要重复刷新以免进入黑名单。)
取消评论
表情 代码 贴图 加粗 链接 私信 删除线 签到

Hi,请填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址