Heim  >  Artikel  >  Web-Frontend  >  Wie verwende ich den Cursor? So verwenden Sie das Cursor-Attribut in CSS und analysieren optionale Werte

Wie verwende ich den Cursor? So verwenden Sie das Cursor-Attribut in CSS und analysieren optionale Werte

yulia
yuliaOriginal
2018-09-12 10:39:5926379Durchsuche

Beim Entwerfen einer Seite ist CSS ein unverzichtbarer Bestandteil der Arbeit. Ich höre oft Leute sagen: „HTML ist, wie eine Person ohne Make-up aussieht, und das Hinzufügen von CSS ist, wie eine Person nach Make-up aussieht.“ Dieser Satz ist leicht zu verstehen und erklärt die Beziehung zwischen CSS und HTML sehr gut. Es gibt viele Attribute in CSS. Heute konzentrieren wir uns auf ein Attribut, das CSS-Cursor-Attribut und seine vielen optionalen Werte. Die Cursor-Handform verwendet beispielsweise das Cursor:Pointer-Attribut.

Wie verwende ich den Cursor?

1. Grundlegende Syntax des CSS-Cursors

Was ist das Cursorattribut: Bezieht sich auf die Cursorform, die angezeigt wird, wenn der Mauszeiger innerhalb der Grenzen platziert wird eines Elements. Es enthält Fragezeichen, kleine Hände und andere Formen.
Wenn Sie es verwenden, können Sie style="cursor: ein bestimmter Attributwert" in jedes Tag einfügen, das Sie hinzufügen möchten, oder Sie können es im CSS-Stil hinzufügen.

Zum Beispiel: 68d12f98743700eaf58b60240b5a03c5pointer, kleine Handform94b3e26ee717c64999d7867364b1b4a3 bb618d9f377907859c4313a877432bf6help, Hilfe Gestalten 5db79b134e9f6b82c0b36e0489ee08ed

Der Attributwert des Cursors verfügt über mehr als ein Dutzend optionale Werte. Wählen Sie einfach den entsprechenden Wert entsprechend Ihren Anforderungen während der Arbeit aus.

2. CSS-Cursor-Attributwert

1. Der am häufigsten verwendete Cursor: Zeiger, der Cursor nimmt die Form einer kleinen Hand an.

<p style="cursor:pointer">pointer</p>

2. Cursor: Hilfe, Fragezeichen-Cursor

<p style="cursor:help;">pointer</p>

3. Cursor: Fadenkreuz, Kreuzcursor

<p style="cursor:crosshair;">pointer</p>

stellt diese häufig verwendeten und andere Attributwerte vor im Detail Sie sind alle auf die gleiche Weise geschrieben, ändern Sie einfach den Attributwert. Die spezifischen Werte und ihre Bedeutung finden Sie weiter unten.

Standard: Der Standardcursor, normalerweise ein Pfeil
Auto: Standard, der vom Browser festgelegte Cursor
Fadenkreuz: Der Cursor stellt das Fadenkreuz dar
Zeiger: Der Cursor stellt den Zeiger dar (eins Hand)
Verschieben: Der Cursor zeigt an, dass das Objekt verschoben werden kann.
E-Größenänderung: Der Cursor zeigt an, dass der Rand des rechteckigen Felds nach rechts verschoben werden kann.
Ne-Größenänderung: Der Cursor zeigt dies an Der Rand des rechteckigen Rahmens kann nach oben und nach rechts verschoben werden. Verschieben
nw-resize: Der Cursor zeigt an, dass der Rand des rechteckigen Rahmens nach oben und nach links verschoben werden kann.
n-resize: Der Cursor zeigt an dass der Rand des rechteckigen Rahmens nach oben verschoben werden kann
se-resize: Der Cursor zeigt den Rand des rechteckigen Rahmens an. Der Rand kann nach unten und nach rechts verschoben werden
sw-resize: Der Cursor zeigt den Rand an des rechteckigen Felds kann nach unten und links verschoben werden
s-resize: Der Cursor zeigt an, dass der Rand des rechteckigen Felds nach unten verschoben werden kann
w-resize: Der Cursor zeigt an, dass der Rand des rechteckigen Felds nach unten verschoben werden kann kann nach links verschoben werden
Text: Der Cursor zeigt Text an
Warten: Der Cursor zeigt an, dass das Programm beschäftigt ist (normalerweise eine Uhr oder eine Sanduhr)
Hilfe: Der Cursor zeigt Hilfe an (normalerweise ein Fragezeichen)

Das Obige stellt hauptsächlich die Verwendung des Cursor-Attributs in CSS und die Bedeutung verschiedener Attributwerte im Editor vor, um zu sehen, was passiert Dir helfen.

Das obige ist der detaillierte Inhalt vonWie verwende ich den Cursor? So verwenden Sie das Cursor-Attribut in CSS und analysieren optionale Werte. 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