Ændring af markør med CSS - Typer af musemarkører og CSS-indstillinger

Table of Contents - いろいろ Tips - 目次: Sitemap Generator - サイトマップ生成プログラム

In-Page Search - 検索を自ページ設置

Download Counter - ダウンロードカウンター

Draft Manager - ブラウザで下書き保存

Text Encryption - テキスト暗号・復号化

CSS & JavaScript - 圧縮・整形/復元ツール

Simple Yet Powerful Note Tool - メモメモ

Task Management - 仕事/やること管理

Local Storage Check - ローカルストレージチェック

Pixel Art - ピクセルアート作成

Freehand Drawing - フリーハンドドローイング

Pomodoro Timer - ポモドーロタイマー

Text Counter - 文字数カウント

Notepad - メモ帳

原稿用紙エディター

俳句・短歌下書きツール

ウィンドウサイズ

インターネット環境

タブを再び開く

Webページ最新状態

ページ内文字検索

スマホページ内検索

画像を加工する

Macでカラーコードを調べ

Mac用解凍ソフト

ショートカット

コピペの方法

右クリック禁止を回避

ローマ字かな入力変換表

ひらがな→ヘボン式ローマ字変換

ウェブページで長音ローマ字

ファイル差分チェック

音声合成

テキスト読み上げ

テキスト読み上げ書き方

全国公衆電話の場所

よく使う記号

キーボードの記号

キーボードの記号と入力方法

操作で使うキーの名称

CSSでカーソルを変える

Ændring af markør med CSS
= Typer af musemarkører og CSS-indstillinger =

På en webside kan musemarkørens eller musepointerens form indstilles ved hjælp af CSS-egenskaben "cursor".
Denne guide undersøger CSS-værdier for forskellige markørformer og hvordan de konfigureres.
Du kan klikke på egenskaberne for at kopiere dem. Denne side inkluderer egenskaben "cursor:copy" for kopierbare elementer.
Eksempelbilleder er tilgængelige for hver egenskab. Dog kan formen variere afhængigt af dit operativsystem og browser.
Hvis du holder musen over sektionerne "Ved hover", kan du se markøren, som den vises i din browser.

《Sådan indstilles det》

Hvis du vil anvende det på flere sektioner på en side, er det almindelig praksis at skrive følgende i <head>-sektionen eller i en ekstern CSS-fil.
".cursorstyle" er et tilpasset klassenavn.

<style>
.cursorstyle {
cursor : pointer;
}
</style> Kopiér
Eksempel på anvendelse af ovenstående CSS ved hjælp af "class"-attributten.
<span class="cursorstyle">Tekst</span> Kopiér

<div class="cursorstyle">Tekst</div> Kopiér

<a class="cursorstyle">Tekst</a> Kopiér
Eksempel, når det anvendes på en enkelt sektion eller få elementer.
Brug "style"-attributten og skriv egenskaben direkte.
<span style="cursor : pointer;">Tekst</span> Kopiér

<div style="cursor : pointer;">Tekst</div> Kopiér

《Markørtyper og CSS-værdier》

CSS-værdier [Klik for at kopiere]	Eksempel i OS [Kan variere afhængigt af browseren]		Mouse-Over Formeksempel	Beskrivelse
CSS-værdier [Klik for at kopiere]	Windows	Mac	Mouse-Over Formeksempel	Beskrivelse
auto cursor: auto;			《Mouse-Over》	Browseren bestemmer automatisk markøren baseret på konteksten
default cursor: default;			《Mouse-Over》	Viser en standardpil
none cursor: none			《Mouse-Over》	Viser ikke en markør
context-menu cursor: context-menu			《Mouse-Over》	Tillader brug af en kontekstmenu
help cursor: help			《Mouse-Over》	Hjælpeelement
pointer cursor: pointer			《Mouse-Over》	Når markøren holdes over et link osv.
progress cursor: progress			《Mouse-Over》	Behandler en opgave. Brugeren kan interagere
wait cursor: wait			《Mouse-Over》	Behandler en opgave. Brugeren kan ikke interagere
cell cursor: cell			《Mouse-Over》	Valgbar tabelcelle
crosshair cursor: crosshair			《Mouse-Over》	Krydskursor, ofte til markering på en bitmap
text cursor: text			《Mouse-Over》	Valgbar tekst
vertical-text cursor: vertical-text			《Mouse-Over》	Valgbar lodret tekst
alias cursor: alias			《Mouse-Over》	Kan oprette en alias eller genvej
copy cursor: copy			《Mouse-Over》	Kan kopieres
move cursor: move			《Mouse-Over》	Kan flyttes
no-drop cursor: no-drop			《Mouse-Over》	Kan ikke droppes på denne position
not-allowed cursor: not-allowed			《Mouse-Over》	Den ønskede handling kan ikke udføres
grab cursor: grab			《Mouse-Over》	Kan trækkes, normalt parret med grabbing
grabbing cursor: grabbing			《Mouse-Over》	Under trækning, parret med grab
all-scroll cursor: all-scroll			《Mouse-Over》	Kan rulle i enhver retning
col-resize cursor: col-resize			《Mouse-Over》	Skalerbar boks med vandret kantbevægelse
row-resize cursor: row-resize			《Mouse-Over》	Skalerbar boks med lodret kantbevægelse
n-resize cursor: n-resize			《Mouse-Over》	Skalerbar boks med kantbevægelse mod nord (top)
w-resize cursor: w-resize			《Mouse-Over》	Skalerbar boks med kantbevægelse mod vest (venstre)
s-resize cursor: s-resize			《Mouse-Over》	Skalerbar boks med kantbevægelse mod syd (bund)
e-resize cursor: e-resize			《Mouse-Over》	Skalerbar boks med kantbevægelse mod øst (højre)
nw-resize cursor: nw-resize			《Mouse-Over》	Skalerbar boks med kantbevægelse mod nordvest (øverst til venstre)
ne-resize cursor: ne-resize			《Mouse-Over》	Skalerbar boks med kantbevægelse mod nordøst (øverst til højre)
sw-resize cursor: sw-resize			《Mouse-Over》	Skalerbar boks med kantbevægelse mod sydvest (nederst til venstre)
se-resize cursor: se-resize			《Mouse-Over》	Skalerbar boks med kantbevægelse mod sydøst (nederst til højre)
ew-resize cursor: ew-resize			《Mouse-Over》	Skalerbar boks med tovejs vandret kantbevægelse
ns-resize cursor: ns-resize			《Mouse-Over》	Skalerbar boks med tovejs lodret kantbevægelse
nesw-resize cursor: nesw-resize			《Mouse-Over》	Skalerbar boks med kantbevægelse i nordøst-sydvest (øverst til højre & nederst til venstre) retninger
nwse-resize cursor: nwse-resize			《Mouse-Over》	Skalerbar boks med kantbevægelse i nordvest-sydøst (øverst til venstre & nederst til højre) retninger
zoom-in cursor: zoom-in			《Mouse-Over》	Kan zoome ind
zoom-out cursor: zoom-out			《Mouse-Over》	Kan zoome ud
URL	Ethvert billede kan indstilles som en markør. Billedstørrelsen er begrænset til 128 × 128px. Eksempelbilledets størrelse er 70 × 70px. 《Mouse-Over》 .cursorimg {cursor: url(image-path), auto;} Kopier ".cursorimg" kan være et vilkårligt navn. <div {cursor: url(image-path), auto;}>Tekst</div> Kopier 《Retina Display-understøttelse》 .cursorimg {cursor: -webkit-image-set(url(@1x-image) 1x, url(@2x-image) 2x), auto;} Kopier

Ændring af markør med CSS= Typer af musemarkører og CSS-indstillinger =

Ændring af markør med CSS
= Typer af musemarkører og CSS-indstillinger =

おすすめサイト・関連サイト…