Question

我这些按钮一整天都遇到了麻烦。首先，两个按钮都是这样的，http://i.imgur.com/wVmntpQ.jpg，现在发布在这里询问该怎么做，现在看起来像这样，http://imgur.com/OmXDQct 有人告诉我改变我的css：

CSS：按钮{
向左飘浮; 边距：250像素; 白颜色; 显示：块; 保证金：30px; 填充：7px 35px; 字体：300 150％langdon; 背景：透明; 边框：3px纯白色; 游标：指针; }

  button:hover {
  background: black;
  border: 1px solid black;
  }

  button:active {
  background: #2e2e2e;
  border: 1px solid black;
  color: white;
  }

Answer 1

好的，这是jsfiddle上的工作代码。我已从按钮中移除了绝对路径并添加了display: inline-block;，所以现在他们一个接一个。我还在包装器中添加了top: 250px声明。

button {
  color:white;
  display: inline-block;
  margin: 30px;
  padding: 7px 35px;
  font: 300 150% langdon;
  background: transparent;
  border: 3px solid white;
  cursor: pointer;

} 

button:hover {
  background: black;
  border: 1px solid black;
}

button:active {
  background: #2e2e2e;
  border: 1px solid black;
  color: white;
}

Answer 2

我猜您只需要将position:relative添加到包含按钮的div，所以请按照以下方式添加：

HTML

<div style="position: relative;">
    GO ROAM</br>
    START HERE.
    <button>SIGN UP</button>
    <button>LOG IN</button>
</div>

希望这会对你有帮助......

按钮现在透明度？

2 个答案:

HTML