首页 文章

如何在同一页面上放置多个充当链接的html按钮？

提问于
浏览 次
0

有没有人知道如何在同一个html页面上放置多个html按钮作为链接？

我目前正在这样做：

<form action="http://justchillinc.wix.com/just-chill">       
    <input type="submit" value="Just Chill">
</form>
<form action="http://google.com">
    <input type="submit" value="Google">
</form>
html button

4 回答

  • 0

    没有风格，但你明白了......任何带有一类按钮的标签都会有相同的风格 .

    .button{
  display:inline-block;
  text-decoration:none;
  color:yellow;
  font-weight:bold;
  min-width:132px;
  min-height:37px;
  border:1px solid black;
  border-radius:12px;
  text-align:center;
  background-color:gray;
  box-shadow:8px 8px 8px gray;
  margin:10px;
  
  }
.button:active{
  background-color:green;
position:relative;
  top:8px;
  left:8px;

}

    <a href="http://google.com" class="button" target="_blank">Link Here</a>
<a href="http://google.com" class="button" target="_blank">Link Here</a>
<a href="http://google.com" class="button" target="_blank">Link Here</a>
<a href="http://google.com" class="button" target="_blank">Link Here</a>
    回复于
  • 1

    你这样做的方式已经很好了 . 以下是一些其他方法：

    HTML：

    <a class="button" href="http://justchillinc.wix.com/just-chill">Just chill</a>

    CSS：

    a.button {
    padding: 5px 10px;
    background-color: #ddd;
    color: #222;
    text-decoration: none;
}

    您可以轻松指定按钮类以提交按钮或类似按钮，以在整个页面上获得一致的按钮外观 .

    码：

    <button onclick="window.location.href='http://google.com';">Google</button>

    重要的是 onclick="location.href='http://google.com';" . 它告诉浏览器在用户单击按钮时打开 http://google.com . 缺点是用户必须启用javascript（几乎每个人都启用了它，所以这不是一个大问题）

    回复于
  • 0

    从：

    <form action="http://justchillinc.wix.com/just-chill">       
    <input type="submit" value="Just Chill">
</form>
<form action="http://google.com">
    <input type="submit" value="Google">
</form>

    至：

    <form method="post" action="http://justchillinc.wix.com/just-chill">       
    <input type="submit" value="Just Chill">
</form>
<form method="post" action="http://google.com">
    <input type="submit" value="Google">
</form>
    回复于
  • 0

    如果您不想复制和粘贴相同的链接，这是一种创建多个链接的方法 .

    <button class= "card" id="card-1">1</button>
<button class= "card" id="card-2">2</button>
<button class= "card" id="card-3">3</button>
<button class= "card" id="card-4">4</button>
<button class= "card" id="card-5">5</button>
<button class= "card" id="card-6">6</button>
<button class= "card" id="card-7">7</button>
<button class= "card" id="card-8">8</button>
<button class= "card" id="card-">9</button>


<script type="text/javascript">
    var elements = document.getElementsByClassName("card");
    for (i = 0; i < elements.length; i ++)
    {
        (function(){
        elements[i].onclick = function () {
        location.href = "https://stackoverflow.com/questions/27888246/how-can-i-place-multiple-html-buttons-that-act-as-links-on-the-same-page#";
        };}());
    };
</script>
    回复于

相关问题