需要CSS3按钮样式

-1

好了，所以我一直在考虑重建这个按钮需要CSS3按钮样式

https://s27.postimg.org/7e1upkf4j/BUTTONS.png

使用HTML的这一部分的

<a href="#"> 
    Home <i class="material-icons ico-style">home</i> 
</a>

我需要帮助，我因此失去了对任务渐变以及部分是否应该是方格阴影或嵌入边框等。请您可以解释答案

来源

2017-04-21 Chris Rushton

你能不能让我知道什么是我的答案失踪？这样我就可以调整你接受。 – LGSon

以下是对渐变部分的建议。图标您需要添加自己。

a { 
 
    position: relative; 
 
    display: inline-block; 
 
    width: 120px; 
 
    height: 50px; 
 
    line-height: 50px; 
 
    text-align: center; 
 
    border-radius: 25px; 
 
    border: 1px solid lightgray; 
 
    background: linear-gradient(#999,#fff); 
 
    text-decoration: none; 
 
} 
 

 
a::before { 
 
    content: ''; 
 
    position: absolute; 
 
    left: 9px; 
 
    top: 9px; 
 
    width: 100px; 
 
    height: 30px; 
 
    border-radius: 15px; 
 
    border: 1px solid gray; 
 
    background: white; 
 
} 
 

 
a span { 
 
    position: relative; 
 
}

<a href="#"> 
 
    <span>Home <i class="material-icons ico-style"></i></span> 
 
</a>

来源

2017-04-21 16:24:33 LGSon

需要CSS3按钮样式

回答

相关问题