web-dev-qa-db-ja.com

ページを初めてロードするときにアクティブなリンクをデフォルトとして設定する方法

ページを最初にロードするときに、リンクをデフォルトとしてアクティブに設定するためのヘルプが必要です。

<style type="text/css">
a{
color:black;
}
a:hover{
color:white;
}
a:active{
color:blue;
}
</style>


<div>
<!--I want this fisrt link to be set as active by default-->
<a href="#"/>
<!--I want this one as normal-->
<a href="#"/>
</div>
9
Amra

マークアップをこれに変更できる場合:

<div>
<!--I want this first link to be set as active by default-->
<a href="#" id="focusmeplease"/>
<!--I want this one as normal-->
<a href="#"/>
</div>

次に、このJavaScriptを使用できます。

document.getElementById('focusmeplease').focus();

そのJavaScriptをページの読み込みに添付します 好きなように (私は好きです この方法 、jQueryを使用している場合を除き、その場合は $(document).ready() )。

7
Dominic Rodger
  1. 「a」タグにクラス(「focus」など)を付けます。
  2. クラス「focus」内のすべてのアクティブな「a」タグを好みの外観に設定します。
<style type="text/css">
a
{color:black;}
a:hover
{color:white;}
a.focus:link, a.focus:visited
{color:blue;}
</style>

<div>
<a href="#" class="focus">This link is active by default.</a>
<a href="#">This is a normal link.</a>
</div>

最後の注意:間違っていたため、「a」タグも修正しました。

1
a{
  color:black;
}
a:hover {
  color:white;
}
a:active, div a:first-child {
  color:blue;
}

最新のブラウザでサポートされていますが、それ以上のものではありません。

0
Tor Valamo