15年软件开发经验 只做源码定制 互联网+定制化解决方案

15年软件开发经验,只做源码定制!

原创设计 定制开发

满足您的个性化需求

当前位置:首页

flex布局时图片变形

李家霖| 发布于 2021-07-24 23:09:24| 415阅读| 0点赞| 0评论
举报

fale布局内容过多 外部容器不足以容纳时会导致图片的变形 使用flex-shrink可以解决

        <view class="box">
			<image src="../../static/logo.png" mode=""></image>
			<view>
				文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字
			</view>
		</view>

	.box{
		width: 200px;
		height: 200px;
		display: flex;
	}
	image{width: 100px;height: 100px;}




弹性盒子中的内容过多 导致容不下时  会对弹性盒子中的内容进行缩放效果  来达到在一行显示的目的 

可以使用  flex-shrink: ;  来设置该元素是否缩放    接收一个数值   数值越大 缩放的比例就越大    当设置为0时表示这个元素不进行缩放

	.box{
		width: 200px;
		height: 200px;
		display: flex;
	}
	image{width: 100px;height: 100px;flex-shrink: 0;}





0

0条评论

别默默看啦~登录/注册一起参与讨论吧~

热门标签

李家霖
微信扫一扫立即咨询
账号登录|扫码登录

立即注册 |忘记密码?

欢迎注册

已有账号马上登录

重置密码

扫码绑定微信
微信扫一扫

绑定手机号

分享到-微信

举报

  • 举报类型:

  • 举报描述:

您好,当前积分不足。

在线客服
拨打电话
17330196230 13230981129
顶部