1

2日前、私は自発的にドメインを購入しました。その前日、私はドメインが実際に何であるかさえほとんど知りませんでした。それ以来、私は初めて自分自身にHTMLを教えようとしてきました。基本的に私が言おうとしているのは、私は非常に新しいことです-そしておそらく私の説明は貧弱でしょう。

ちょっと「画像ボタン」を作ることに成功しました。ここで、ボタンのような画像を作成し、それをWebサイトのナビゲーションとして使用します(通常のリンクと同じように)。私の問題は、リンク「border」自体が画像よりも大きいため、画像自体の外側を1インチ押すと、機能することです。非表示のリンク「境界線」をボタンと同じサイズにするにはどうすればよいですか?

これは私のサイトです: http ://www.djeveln.com

テストページ(djeveln.com/test)で、私は物事をテストします。私の説明がよくわからない場合に備えて、私が話しているボタンがあります。

これが私のHTMLです:

<a class="ButtonLink" href="http://www.djeveln.com" title="Home"> 
<img src="/images/button.png" class="TestButton"></a> 

画像の位置とサイズに使用するCSSは次のとおりです。

img.TestButton { /* Dette linker til selve størrelsen av knappen (bildet)*/ 
    position: absolute; 
    width: 100px; 
    height: 75px; 
    top: 400px;
    right: 250px; 
}

あなたが私を助けてくれることを願っています!:P

4

2 に答える 2

4

ボタンの画像には大きな透明な領域が含まれており(実際のボタンはほぼ中央にあります)、それが「境界線」の原因です。

これにはCSSの回避策がありますが、Photoshop(またはその他の画像エディター)で画像を開き、透明な領域を切り抜くことをお勧めします。画像をボタンの正確なサイズにします。

もう1つのヒントは、学習しながら生活を楽にすることができます。ChromeデベロッパーツールやFirebug(Firefoxを使用している場合)などのデバッグツールを使用します。これらを使用すると、HTML上の任意の要素を検査し(右クリックして[検査]を選択)、それらに適用されているCSSを確認します(テストのためにオンザフライで変更します)。それが私があなたの画像の透明な境界線を見つけた方法です。

于 2012-06-17T21:18:45.657 に答える
0

一見すると、単に画像を大きくしすぎているように見えます。クリック ターゲットの一部であるボタンの外側に、透明な画像がたくさんあります。ボタンの作り方は?

たとえば、Photoshop で作成した場合は、ボタンの境界線にぴったり合うように画像をトリミングする必要があります。

CSSでそれを行うこともできますが、自分で作業することになります.ソース画像を変更します.

于 2012-06-17T21:21:36.070 に答える