css3
qq_2422941992
qq_2422941992
展开
-
css3设置图片自适应缩放
object-fit:cover; <div class="theImg"> <img src="../assets/img/img1.jpg"> </div> <style> .theImg{ width: 200px; height: 200px; } .theImg>img{ width: 100%; height: 100%; object-fit:cover; } </style...原创 2020-12-31 11:14:10 · 586 阅读 · 1 评论 -
小程序获取元素样式(宽高间距)
//获取宽度,设置高度等于宽度 var query = wx.createSelectorQuery().in(this); var that = this; query.select('.chooseImgItem').boundingClientRect(function (rect) { console.log(rect); that.setData({ 'objHeight': rect.width + 'px' }) ..原创 2020-10-08 20:30:22 · 372 阅读 · 0 评论 -
css设置图片根据最大边自适应
<div class="img_box"> <img src="1.jpg" alt="" class="img_newItem"> </div> 父级设置宽高和flex布局,子级图片设置最大宽高(max-width\max-height)为100%,宽高(width\height)为auto; .img_box{ width:100%; height:100%; display: flex; justify-content.原创 2020-10-08 20:26:41 · 928 阅读 · 0 评论 -
vue单页面切换动画效果
<transition name="slide-fade"> <router-view/> </transition> <style scoped> .slide-fade{ position: absolute;left:0;right: 0; } .slide-fade-enter-active { transition: all .5s ease; } .slide-fade-leave-active { tran...原创 2020-10-08 20:24:23 · 370 阅读 · 0 评论 -
css怎么设置文本超出显示省略号
1、单行文本超出 .divObj{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } 2、多行文本超出 .divObj{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-c...原创 2020-02-09 13:03:07 · 86 阅读 · 0 评论 -
vue -webkit-box-orient vertical webpack打包后被过滤掉了 线上没有这行代码
问题:vue -webkit-box-orient vertical webpack打包后被过滤掉了 线上没有这行代码 解决: (1)方法一:加上绿色注释,跳过webpack的css打包 .word-overflow-3{ overflow:hidden; text-overflow:ellipsis; display:-webkit-box; /*! autoprefix...原创 2020-02-09 13:03:21 · 265 阅读 · 0 评论