一、绝对定位,自适应父级大小css:css
.search-icon-delete { background: url('../../assets/images/search_icon_deleteGray.png') no-repeat left center; width: 40px; height: 40px; position: absolute; right: 0; top: 0; }
html:html
<input type="text" name="search" id="search" value="" placeholder="" style="padding-left:45px;"/> <span class="search-icon-delete" style="display:none"></span>
效果:web
二、图片放置到文本框中:url
#phone { background: url('../image/me_icon_kefu@2x.png') no-repeat left center; background-size: 30px; }
效果:spa
三、按钮颜色渐变:code
#add_tourist { background-image: linear-gradient(-90deg, #FF8126 0%, #F74A1C 100%); }
效果:htm
四、内容超过两行隐藏blog
.text-box { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
效果:图片