自适应按钮

来源:互联网 发布:叉叉助手最新源码 编辑:程序博客网 时间:2024/05/01 15:36

HTML

<div class="Container"><div class="BtnContainer">      <a href="javascript:void(0)" class="DldNow">使用此模板,立即制作</a></div></div>


css


.Container{width:100%;height:60px;background:#2d3132;position:absolute;left:0px;bottom:30px;}.Container .DldNow{ display: block;    height: 38px;    line-height: 38px;    text-align: center;    vertical-align: middle;    color: #ffffff;    background: #04be02;    border: 1px solid rgba(0,0,0,0.2);    padding: 0px 8px;    border-radius: 4px;    font-size: 16px;    font-weight: bold;    left: 86px;    right: 86px;    top:10px;    /* 字体溢出设置 */    position: absolute;     white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; }.DldNow:before{    content:" ";    position:absolute;    top:0px;    right:0px;    border-top:1px solid #d9d9d9;    color:#d9d9d9;    background-color: #d9d9d9;    -webkit-transform-origin: 0 0;    transform-origin: 0 0;    -webkit-transform: scaleY(0.5);    transform: scaleY(0.5);    z-index:5;}


0 0
原创粉丝点击