0

HTML/CSS と Java スクリプトを使用してボタンを作成しました。ボタンは誰かを別のページに誘導するはずですが、機能していません。Chrome と Safari では問題なく動作しますが、Firefox では動作しません。

Firefox と IE で動作するようにコードを手伝ってくれる人はいますか?

ありがとう。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>
    <title>WTF</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>

<style type="text/css">


button{
color:#08233e;
font:2.4em Futura, ‘Century Gothic’, AppleGothic, sans-serif;
font-size:70%;
padding:14px;
background:url(overlay.png) repeat-x center #ffcc00;
background-color:rgba(255,204,0,1);
border:1px solid #ffcc00;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
border-bottom:1px solid #9f9f9f;
-moz-box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
cursor:pointer;
}

button:hover{background-color:rgba(255,204,0,0.8);}

</style>

<body>

<button><a href="http://www.ihatelebronjames.com" class="button1">LEBRON IS A NO-GOOD, BACK-STABBING, AFRAID-OF-THE-MOMENT CHOKE ARTIST!</a></button><br>
<button><a href="http://www.lebronjames.com" class="button2">LEBRON IS THE PINNACE OF BASKETBALL PERFECTION!</a></button>            


</body>

</html>
4

4 に答える 4

2

非常に簡単な修正は次のとおりです。

<a href="http://www.lebronjames.com" class="button2"><button>LEBRON IS THE PINNACE OF BASKETBALL PERFECTION!</button></a>

ボタンタグを a タグ内に配置する

別の（そしてより良い方法）オプション：

http://jsfiddle.net/a6seL/

ここでは、クラス「button2」を<a>. 次に、 で行ったようにスタイルを設定します<button>が、実際にボタンの外観を得るためdisplay : blockに、クラスにも追加します。

これで、 のみが必要に<a>なり、それ以上は不要になりまし<button>た。

それについては、私の jsfiddle を参照してください。

于 2012-06-14T19:34:11.717 に答える
1

リンクまたはボタンを使用します。2つを混在させることは本当に意味がありません。リンクが必要な場合は、リンクを使用してください。ボタンが必要な場合は、ボタンを使用します。

ボタン (またはその他の要素) をスタイル設定のみに使用することは、非常に悪い習慣です。セマンティックで意味のある HTML に合わせて CSS を調整します。

<a>また、XHTML 1.0 では、単に anを aに入れることはできません<button>。

<!-- button uses %Flow; but excludes a, form and form controls -->

<!ENTITY % button.content    "(#PCDATA | p | %heading; | div | %lists; | %blocktext; |
    table | %special; | %fontstyle; | %phrase; | %misc;)*">

XHTML 1.0 Transitional DTD (使用している)から

于 2012-06-14T19:37:08.967 に答える
0

それはできません。ボタンはリダイレクトではありません。リンクを作成して CSS でボタンのように見せるか、ボタンを作成して次のように JS 機能を与えることができます。

<button onclick="self.location=('http://www.ihatelebronjames.com');">LEBRON IS A NO-GOOD, BACK-STABBING, AFRAID-OF-THE-MOMENT CHOKE ARTIST!</a></button><br>
<button onclick="self.location=('http://www.lebronjames.com');">LEBRON IS THE PINNACE OF BASKETBALL PERFECTION!</a></button>
于 2012-06-14T19:38:17.360 に答える
0

ボタンの外側にアンカーをラップすると、適切に処理されると思いますが、ボタンに有効なインクを実装する方法については 100% 確信が持てません。

于 2012-06-14T19:34:29.500 に答える