html – 还是?有什么不同?

前端之家收集整理的这篇文章主要介绍了html – 还是?有什么不同?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
saw我们可以写:
<form method="link" action="foo.html" >
<input type="submit" />
</form>

制作“链接按钮”.

但是我知道我们可以写:

<a href="foo.html" ><input type="button" /></a>

哪个会做同样的事情

有什么不同?他们的浏览器兼容性是什么?

解决方法

链接到的页面不正确.没有方法=“LINK”值.这将导致窗体返回到默认方法GET,这相当于具有href属性的锚点元素.
<form method="GET" action="foo.html">
    <input type="submit" />
</form>

这与你的例子是一样的,但有效;相当于:

<a href="foo.html">

您应该使用语义来确定实现您的表单的方式.由于没有用户填写的表单字段,这不是一个真正的表单,因此您不需要使用< form>得到效果.

何时使用GET表单的示例是一个搜索框:

<form action="/search">
    <input type="search" name="q" placeholder="Search" value="dog" />
    <button type="submit">Search</button>
</form>

以上允许访问者输入自己的搜索查询,而这个锚点元素不会:

<a href="/search?q=dog">Search for "dog"</a>

但是,当提交/单击时,两者都将转到同一页面(假设用户不会改变第一个文本字段

另外,我使用以下CSS来获取看起来像按钮的链接

button,.buttons a {
    cursor: pointer;
    font-size: 9.75pt;  /* maximum size in WebKit to get native look buttons without using zoom */
    -moz-user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
}
.buttons a {
    margin: 2px;
    padding: 3px 6px 3px;
    border: 2px outset buttonface;
    background-color: buttonface;
    color: buttontext;
    text-align: center;
    text-decoration: none;
    -webkit-appearance: button;
}
button img,.buttons a img {
    -webkit-user-drag: none;
    -ms-user-drag: none;
}
.buttons form {
    display: inline;
    display: inline-block;
}

猜你在找的HTML相关文章