我需要有关我的 css 按钮代码的帮助 [重复]答案

【问题标题】：I need help on my css button code [duplicate]我需要有关我的 css 按钮代码的帮助 [重复]
【发布时间】：2014-08-22 10:55:33
【问题描述】：

我想知道，在我的 css 代码上可以写什么来获得这个按钮...

我尝试了一些边框（和半径）stuuf，但没有得到我想要的！

http://i.stack.imgur.com/3yPuL.png

【问题讨论】：

向我们展示您的尝试！
“你想要”的它是什么？当您尝试“边框（和半径）[stuff]”时，您没有得到什么？ 确切地说，您尝试了什么，出了什么问题？
如您所见，愿意帮助您的人很多。我刚刚在不到一分钟的时间内编写了 CSS 代码。但我们希望看到您正在做出什么样的努力，而不是仅仅为您提供免费代码。
tc3.edu/instruct/sbrown/pic/miracle.jpg
我假设您希望按钮具有圆形边框？如果是这样，只需对您的 css 规则执行 border-radius。

标签： html css button user-interface

【解决方案1】：

这是一个几乎完全相同的副本。您可以为自己的按钮研究此代码：http://jsfiddle.net/M3uE9/1/。

HTML：

<button>Portfolio</button>

CSS：

button {
    border: 2px solid rgba(100, 100, 100, 1);
    border-radius: 5px;
    padding: 10px;
    background-color: #fff;
    color: rgba(50, 50, 50, 1);
    text-transform: uppercase;
    letter-spacing: 1px;
    font: 14px/1 Sans-Serif;
}

【讨论】：

【解决方案2】：

认为这就是你想要的。你的html：

<input type="button" class="b" value="button">

你的 CSS：

.b{
    border:solid;
    border-width:2px;
    border-radius:5px;
    background-color:white;
    font-size:20px;
    color:grey;
    padding:6px;
}

.b:hover{
    border-color:#aaaaaa;
    color:#aaaaaa;
}
.b:active{
    border-color:#555555;
    color:#555555;
}

喜欢吗？ ;-)

JSFIDDLE

【讨论】：