【记录】css样式

记录css的样式设置,方便之后使用。

一、绝对定位,自适应父级大小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;
}

效果:图片

相关文章
相关标签/搜索