Heim > Artikel > Web-Frontend > So deaktivieren Sie Klicks in CSS
So deaktivieren Sie Klicks in CSS: 1. Fügen Sie dem Eingabefeld einen deaktivierten Status hinzu, indem Sie „deaktiviert“ festlegen. 2. Fügen Sie einen deaktivierten Status zum deaktivierten Status hinzu, indem Sie „cursor:not-allowed“ festlegen -events:none" Das ist es.
Die Betriebsumgebung dieses Artikels: Windows 7-System, HTML5- und CSS3-Version, DELL G3-Computer
CSS implementiert deaktivierten Status, Stileinstellungen und nicht anklickbares Ereignisverhalten
Heute werde ich mit Ihnen einen Artikel darüber teilen Deaktivieren von Status- und Stileinstellungen über CSS Neben einer Beispielerklärung für nicht anklickbare Stilereignisse hat es einen guten Referenzwert und ich hoffe, dass es für alle hilfreich sein wird. Kommen Sie und schauen Sie es sich gemeinsam mit mir an
1, readonly bedeutet, dass der Wert dieses Felds nicht geändert werden kann und nur mit type= verwendet werden kann „Text“. Kopieren, auswählbar, kann Fokus erhalten, kann übergebene Werte im Hintergrund empfangen.
Codedemonstration:
<input type="text" name="firstname" value="" readonly="readonly" />
2, disabled bedeutet, dass das Eingabeelement deaktiviert ist und nicht bearbeitet werden kann , kann nicht kopiert werden, kann nicht ausgewählt werden, kann nicht empfangen werden Fokus, Der Hintergrund kann den übergebenen Wert nicht empfangen
Codedemonstration:
<input type="text" name="firstname" value="" disabled="disabled" />
Es gibt zwei Haupt Erscheinungsformen dafür, dass die Maus nicht anklickbar ist:
1. Wenn die Maus nicht anklickbar ist. Anzeigestatus: Cursor: nicht zulässig. Stildemonstration:
<style> input[readonly] //readonly:后台能接收此input框传值 { background:#dddddd; //为带有readonly的input框添加背景颜色 cursor: not-allowed // 表示一个红色的圈加一个斜杠 } </style>. 2. Die ursprünglichen Mausereignisse können nicht implementiert werden: Zeigerereignisse: keine Stildemonstration:
<style> input[disabled] //disadled:后台不可接收此input传值 { background:#dddddd; //为带有disabled的input框添加背景颜色 pointer-events:none;//鼠标点击不可修改 } </style>
--------- ----------------------erweitern----------- ---------------- ------
Standard:
Vererbung: | Ja |
---|---|
Version: | CSS2 |
JavaScript-Syntax: | |
Mögliche Werte |
URL | |
---|---|
Die URL des zu verwendenden benutzerdefinierten Cursors. Hinweis: Definieren Sie immer einen normalen Cursor am Ende dieser Liste, falls kein verfügbarer Cursor durch die URL definiert ist. |
Standard | Standardcursor (normalerweise ein Pfeil)
Auto | Standard. Der vom Browser gesetzte Cursor. |
Fadenkreuz | Der Cursor wird als Fadenkreuz dargestellt. |
Zeiger | Der Cursor wird als Zeiger (eine Hand) dargestellt, der einen Link anzeigt. |
move | Dieser Cursor zeigt an, dass ein Objekt verschoben werden kann. |
e-resize | Dieser Cursor zeigt an, dass der Rand des rechteckigen Felds nach rechts (Osten) verschoben werden kann. |
ne-resize | Dieser Cursor zeigt an, dass der Rand des rechteckigen Felds nach oben und nach rechts (Norden/Osten) verschoben werden kann. |
nw-resize | Dieser Cursor zeigt an, dass der Rand des rechteckigen Felds nach oben und nach links (Norden/Westen) verschoben werden kann. |
n-resize | Dieser Cursor zeigt an, dass der Rand des rechteckigen Felds nach oben (Norden) verschoben werden kann. |
se-resize | Dieser Cursor zeigt an, dass der Rand des rechteckigen Felds nach unten und nach rechts (Süden/Osten) verschoben werden kann. |
sw-resize | Dieser Cursor zeigt an, dass der Rand des rechteckigen Felds nach unten und links (Süden/Westen) verschoben werden kann. |
s-resize | Dieser Cursor zeigt an, dass der Rand des rechteckigen Felds nach unten (Süden) verschoben werden kann. |
w-resize | Dieser Cursor zeigt an, dass der Rand des rechteckigen Felds nach links (Westen) verschoben werden kann. |
Text | Dieser Cursor zeigt Text an. |
Warten | Dieser Cursor zeigt an, dass das Programm beschäftigt ist (normalerweise eine Uhr oder eine Sanduhr). |
Hilfe | Dieser Cursor zeigt verfügbare Hilfe an (normalerweise ein Fragezeichen oder eine Sprechblase). |
Das obige ist der detaillierte Inhalt vonSo deaktivieren Sie Klicks in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!