Heim  >  Artikel  >  Web-Frontend  >  So ändern Sie den Stil der normalen Mausauswahl mit CSS

So ändern Sie den Stil der normalen Mausauswahl mit CSS

WBOY
WBOYOriginal
2021-12-03 12:00:042608Durchsuche

In CSS können Sie das Cursor-Attribut verwenden, um den Stil der Maus während der normalen Auswahl zu ändern. Die Funktion dieses Attributs besteht darin, die Form des Maus-Anzeigecursors festzulegen. Sie müssen nur den „Cursor: Maus-Anzeigestil“ hinzufügen ;"-Stil für das Element.

So ändern Sie den Stil der normalen Mausauswahl mit CSS

Die Betriebsumgebung dieses Tutorials: Windows 10-System, CSS3- und HTML5-Version, Dell G3-Computer.

So ändern Sie den Stil der normalen Mausauswahl in CSS

In CSS können Sie das Cursor-Attribut verwenden, um den Stil der normalen Mausauswahl zu ändern. Die Funktion des Cursor-Attributs besteht darin, den Typ (Form) zu bestimmen ) des anzuzeigenden Cursors. Diese Eigenschaft definiert die Cursorform, die verwendet wird, wenn der Mauszeiger innerhalb der Grenzen eines Elements platziert wird.

Ein Teil der Stileffekte ist im Bild unten dargestellt:

So ändern Sie den Stil der normalen Mausauswahl mit CSS

Das Beispiel sieht wie folgt aus:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
    .div1{
        width:100px;
        height:100px;
        border:1px solid #000000;
        cursor:pointer;
    }
    .div2{
        width:100px;
        height:100px;
        border:1px solid #000000;
        cursor:wait;
    }
    .div3{
        width:100px;
        height:100px;
        border:1px solid #000000;
        cursor:move;
    }
    .div4{
        width:100px;
        height:100px;
        border:1px solid #000000;
        cursor:text;
    }
    </style>
</head>
<body>
    <div class="div1"></div>
    <div class="div2"></div>
    <div class="div3"></div>
    <div class="div4"></div>
</body>
</html>

Ausgabeergebnis:

So ändern Sie den Stil der normalen Mausauswahl mit CSS

(Teilen von Lernvideos: CSS-Video-Tutorial)

Das obige ist der detaillierte Inhalt vonSo ändern Sie den Stil der normalen Mausauswahl mit CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn