如何更改按钮中文本的颜色?

时间:2015-05-25 23:52:32

标签: html css

我正在制作一个简单的网站,其中大多数都有一个顶级栏。虽然我正在为每个部分设计一个按钮,但我遇到的问题是我无法改变按钮的字体颜色。有人可以帮忙吗?我知道怎么用div而不是按钮。这是我的代码:

<html>
    <head>
        <style>
            button {
                outline: none;
                border-radius: 5px;
                margin-top:5px;
                color:#DEDEDE;
                border:1px solid black;
                height:30px;
                margin-left: 15px;
                margin-right: 15px
            }
            #bThree {
                margin-right: 550px;
            }
            #topBar {
                border-radius: 5px;
                height: 40px;
                width:100%;
                background:blue;
                background-color:#20AB53;  
            }
        </style>
    </head>
    <body>
        <div id="topBar">
            <button id="bOne">About</button>
            <button id="bTwo">Home</button>
            <button id="bThree">Log In</button>
            <button id="bFour">Sign Up</button>
            <button id="bFive">Contact</button>
        </div>
    </body>
</html>

button {
  outline: none;
  border-radius: 5px;
  margin-top: 5px;
  color: #DEDEDE;
  border: 1px solid black;
  height: 30px;
  margin-left: 15px;
  margin-right: 15px;
}
#bThree {
  margin-right: 550px;
}
#topBar {
  border-radius: 5px;
  height: 40px;
  width: 100%;
  background: blue;
  background-color: #20AB53;
}
<div id="topBar">
  <button id="bOne">About</button>
  <button id="bTwo">Home</button>
  <button id="bThree">Log In</button>
  <button id="bFour">Sign Up</button>
  <button id="bFive">Contact</button>
</div>

1 个答案:

答案 0 :(得分:3)

http://jsfiddle.net/zakCa/1/

.button {
    color: green;
}