Question

我正在尝试使用按钮标记链接按钮，该按钮标记设置为显示使用CSS3创建的按钮。该按钮在Chrome和Safari中正常工作和显示，但在FireFox中按钮显示但它没有链接，它也会稍微弄乱页面的样式。

我知道你用来不能使用

该页面的链接位于http://pt11.com/index2.php?x=videos.html

这是我的HTML：

<head>
<link rel="stylesheet" type="text/css" href="videos.css" />
</head>
<br>


<div class="vidholder">

<div class="textbox">
<h2>Eythor Bender at TEDMED 2011</h2>
</div>


 <div class="textbox2">
 Eythor Bender's Ekso Bionics makes powered, wearable robots known as "exoskeletons" that           boost human strength, endurance, and mobility. But can they help a paraplegic walk? Watch this incredible story.

 </div>

 <div class="img">
 <img src="ted.png">
  </div>



     <button type="button" name="" value="" class="css3button"><a href="http://www.youtube.com/watch?feature=player_embedded&v=tgWrCNH9gHc" target="_blank">Watch Video</a></button>

     </div>
      <br>

     </div>

然后是按钮的CSS

     button.css3button {
padding
    margin:-3px 0px 0px 325px;

font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #ffffff;
padding: 10px 20px;
background: -moz-linear-gradient(
    top,
    #ff2819 0%,
    #ab0000);
background: -webkit-gradient(
    linear, left top, left bottom, 
    from(#ff2819),
    to(#ab0000));
border-radius: 0px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border: 1px solid #7d0000;
-moz-box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 2px rgba(255,255,255,0.7);
-webkit-box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 2px rgba(255,255,255,0.7);
text-shadow:
    0px -1px 0px rgba(000,000,000,0.4),
    0px 1px 0px rgba(255,255,255,0.3);
         }

Answer 1

您是否需要按钮元素？为什么不使用

<a class="css3button">

并更改您的css选择器以匹配。这会将样式应用于锚点，不再需要按钮元素，它可以在所有浏览器中使用。

FireFox按钮没有链接

1 个答案: