☰

「pointer-events: none」を使用するときに CSS カーソル プロパティを追加する 質問する

tag-icon • tag-icon css
「pointer-events: none」を使用するときに CSS カーソル プロパティを追加する 質問する

特定のリンクを無効にしてカーソル スタイルを適用しようとしていますが、この CSS コマンドはcursor: text;効果がありません。カーソルは常にデフォルトです。最新の Firefox バージョンを使用しています。

CS: ...

pointer-events: none !important;
cursor: text;
color: Blue;

ベストアンサー1

pointer-events: nonewillの使用すべてのマウス操作を無効にするその要素で。プロパティを変更する場合はcursor、変更を親要素に適用する必要があります。リンクを要素でラップし、cursorそれにプロパティを追加することができます。

例はこちら

html

<span class="wrapper">
    <a href="#">Some Link</a>
</span>

CS

.wrapper {
    position: relative;
    cursor: text;  /* This is used */
}
.wrapper a {
    pointer-events: none;
}

ただし、ブラウザ間での不一致がいくつかあります。IE11 でこれを動作させるには、疑似要素が必要なようです。疑似要素を使用すると、FF でテキストを選択することもできます。奇妙なことに、Chrome では疑似要素がなくてもテキストを選択できます。

更新された例

.wrapper:after {
    content: '';
    position: absolute;
    width: 100%; height: 100%;
    top: 0; left: 0;
}

おすすめ記事