web-dev-qa-db-ja.com

hrefなしのリンクのカーソルスタイルをポインターに設定する方法

href javascript呼び出しを行うためのonclick属性を持たない<a> htmlタグがたくさんあります。これらのリンクには、ポインタースタイルのカーソルはありません。テキストスタイルのカーソルがあります。

href属性を使用せずに、リンクのカーソルスタイルをポインターに設定するにはどうすればよいですか？

Href = "＃"を追加できることは知っています。これはhtml文書の多くの場所にあります。href属性を使用せずにリンクのカーソルスタイルポインターを作成する方法を知りたいです。

javascripthtmlcsshyperlinkcursor
119
kevin

あなたのcssファイルにこれを追加してください...

a:hover {
 cursor:pointer;
}

cSSファイルがない場合は、これをHTMLページのHEADに追加します

<style type="text/css">
 a:hover {
  cursor:pointer;
 }
</style>

また、javascriptの最後にfalseを返すことでhref = ""属性を使用できます。

<a href="" onclick="doSomething(); return false;">a link</a>

これには多くの理由があります。 SEOまたは人々がjavascriptを持っていない場合、href = ""が機能します。例えば.

<a href="nojavascriptpage.html" onclick="doSomething(); return false;">a link</a>

@see http://www.alistapart.com/articles/behavioralseparation

編集：@BalusCの answer に注意する価値は、OPのユースケースでは:hoverは不要であると述べている点です。 :hoverセレクターを使用して他のスタイルを追加できます。

193
Ross

これをグローバルCSSスタイルに追加するだけです：

a { cursor: pointer; }

これにより、ブラウザのデフォルトのカーソルスタイルに依存しなくなります。

14
BalusC

style = "cursor：pointer;"

6
mxmissile

これは、特定のobject（myObject）にカーソルを合わせたときに、カーソルを矢印から手に変更する方法です。

myObject.style.cursor = 'pointer';
5
Lou

それらにすべて共通のクラス（たとえばリンク）を与えます。次に、css-fileを追加します。

.link { cursor: pointer; }

または、@ mxmissileが示唆したように、style = "cursor：pointer;"を使用してインラインで実行します。

4
Alxandr

次のCSSを使用してクラスを作成し、onclickイベントを使用してタグに追加します。

cursor:pointer;
3
Dan

正しく覚えている場合は、CSS cursor: pointerを使用します。

CSSファイルのいずれか：

.link_cursor
{
    cursor: pointer;
}

次に、リンクカーソルを配置する要素に次のHTMLを追加します。class="link_cursor"（推奨される方法）。

または、インラインCSSを使用します。

<a style="cursor: pointer;">
2
Andy Shellam