为什么这个CSS按钮与<a>标签混淆？

这里是我的CSS为什么这个CSS按钮与<a>标签混淆？

button { 
    border: 0 none; 
    cursor: pointer; 
    padding: 0 15px 0 0; 
    text-align: center; 
    height: 30px; 
    line-height: 30px; 
    width: auto; 
} 
button a { 
    color:white; 
    text-decoration:none; 
} 

button.rounded { 
    background: transparent url(/images/button/btn_right.png) no-repeat scroll right top; 
    clear: left; 
    font-size: 0.8em; 
} 

button span { 
    display: block; 
    padding: 0 0 0 15px; 
    position: relative; 
    white-space: nowrap; 
    height: 30px; 
    line-height: 30px; 
} 

button.rounded span { 
    background: transparent url(/images/button/btn_left.png) no-repeat scroll left top; 
    color: #FFFFFF; 
} 

button.rounded:hover { 
    background-position: 100% -30px; 
} 

button.rounded:hover span { 
    background-position: 0% -30px; 
} 

button::-moz-focus-inner { 
border: none; 
}

这里是我的“按钮”，在它的链接代码。

<button class="rounded"><span><a href="profile.php">Profile</a></span></button>

问题是它没有链接到我点击它时的href。任何人都知道为什么？

来源

2010-06-14 Ian McCullough

单词配置文件在按钮内。单击按钮内的任何位置都会得到相同的结果。 – 2010-06-14 20:20:53

顺便说一下，这不是一个CSS问题。这是一个“我不明白按钮”的问题：

http://www.w3schools.com/tags/tag_button.asp

一个按钮可以有“提交”，“按钮”或“重启”行动。如果您使用的是“按钮”操作，您应该在OnClick事件中提供必要的JavaScript以导航到有问题的页面。

来源

2010-06-14 20:22:00 NotMe

我相信按钮需要一个类型和值属性。

http://www.w3schools.com/tags/tag_button.asp

您还可以添加的onclick这样的：

<button onclick="location.href='/profile.php';">Profile</button>

但是，因为它只是一个普通的链接，你就必须使用<a>标签，并用CSS样式它更容易的时间。

来源

2010-06-14 20:19:59 Kevin

这个答案有什么问题？这与5 + upvotes的答案几乎相同。 – Kevin 2010-06-14 20:29:34

我没有降低你的评分，但（1）答案声称'type'和'value'是必需的 - 它们是可选的。（2）在声称它们是必需的之后，该示例没有这些属性！（3）它没有解决核心问题，即按钮内部的链接是无效的标记。 – 2010-06-14 21:46:15

我今天在另一个问题上被钉上了一个问题，在那里我提供了几乎完全相同的信息，这个信息被高估了很多。看起来我犯了一个语义错误，称之为某个领域，我应该说属性。去搞清楚。 +1提供位置的实际JavaScript代码。 – NotMe 2010-06-14 22:33:28

为什么这个CSS按钮与<a>标签混淆？

回答

相关问题