3

私の問題は次のとおりです。

これは私のHTMLコードの一部です：

<form method='GET' name='auftragaufgeben' action='AuftragAufgeben'>
    <input  type='submit' name='auftragaufgeben2' value='Auftrag aufgeben'>
    <input type='hidden' name='logged' value='logged'>
</form>

いいえ、cssを使用したボタンのデザインが必要です。これはコードです：

a.auftragaufgeben {
display: block;
background-image: url(AuftragAufgeben.png);
width: 467px;
height: 104px;
}

a.auftragaufgeben:hover {
background-image: url(AuftragAufgeben_Hover.png);
}

ボタンタグでのクラスの宣言が機能するはずです。たとえば、次のようになります。

<form method='GET' name='auftragaufgeben' action='AuftragAufgeben'>
<input  class="auftragaufgeben" type='submit' name='auftragaufgeben2' value='Auftrag aufgeben'>
    <input type='hidden' name='logged' value='logged'>
</form>

しかし、これは何も変わりません。ボタンのレイアウトをCSS部分で宣言した画像に変更するにはどうすればよいですか？または、画像をクリックしたときにフォームを開始する別の方法はありますか？

敬具

4

1 に答える 1

6

cssでは、コードa.auftragaufgebenとa.auftragaufgeben：hoverは、ボタンではなく、リンク要素のスタイルを設定するためのものです。

試す

.auftragaufgeben {
    display: block;
    background-image: url(AuftragAufgeben.png);
    width: 467px;
    height: 104px;
}

.auftragaufgeben:hover {
    background-image: url(AuftragAufgeben_Hover.png);
}

アップデート

最終的なHTMLコードは次のようになります。

<html>
    <head>
        <style>
            .auftragaufgeben {
                display: block;
                background-image: url(AuftragAufgeben.png);
                width: 467px;
                height: 104px;
            }
            .auftragaufgeben:hover {
                background-image: url(AuftragAufgeben_Hover.png);
            }
        </style>
    </head>
    <body>
        <form method='GET' name='auftragaufgeben' action='AuftragAufgeben'>
            <input  class="auftragaufgeben" type='submit' name='auftragaufgeben2' value='Auftrag aufgeben'>
            <input type='hidden' name='logged' value='logged'>
        </form>
    </body>
</html>
于 2012-06-18T22:37:12.250 に答える