记录css的样式设置,方便以后使用。
1、绝对定位,自适应父级大小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:
<input type="text" name="search" id="search" value="" placeholder="" style="padding-left:45px;"/> <span class="search-icon-delete" style="display:none"></span>
效果:
2、图片放置到文本框中:
#phone { background: url('../image/me_icon_kefu@2x.png') no-repeat left center; background-size: 30px; }
效果:
3、按钮颜色渐变:
#add_tourist { background-image: linear-gradient(-90deg, #FF8126 0%, #F74A1C 100%); }
效果:
4、内容超过两行隐藏
.text-box { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
效果: