Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Codebeispiel zum Deaktivieren von ausgewähltem Text über CSS-Regeln

黄舟
Freigeben: 2017-04-18 09:44:17
Original
1619 Leute haben es durchsucht

In manchen Fällen ist die Deaktivierung der Textauswahl immer noch erforderlich, beispielsweise wenn Sie nicht möchten, dass andere Ihre Artikel kopieren. Zu diesem Zeitpunkt können wir dieses Problem durch die Verwendung von CSS+JS lösen. Darüber hinaus ist hier darauf hinzuweisen, dass User-Select noch kein offizieller W3C-Standard ist und jeder Browser Unterstützung in Form privater Attribute bereitstellt.

Syntax

Formal syntax: none | text | all | element
Nach dem Login kopieren

Der Code lautet wie folgt:

(-prefix-)user-select: none;
(-prefix-)user-select: text;
(-prefix-)user-select: all;
(-prefix-)user-select: element;
Nach dem Login kopieren

Der Code lautet wie folgt:

.row-of-icons {
-webkit-user-select: none; /* Chrome all / Safari all */
-moz-user-select: none; /* Firefox all */
-ms-user-select: none; /* IE 10+ */</p> <p> /* No support for these yet,use at own risk */
-o-user-select: none;
user-select: none;
}
Nach dem Login kopieren

IE-Kompatibilität

Derzeit kann die Regel -ms-user-select in Browsern von IE 10 und höher verwendet werden, aber in früheren Versionen von IE können wir die Auswahl nur deaktivieren Javascript. Text:

Der Code lautet wie folgt:

$(el).attr(&#39;unselectable&#39;,&#39;on&#39;)
.css({&#39;-moz-user-select&#39;:&#39;-moz-none&#39;,
&#39;-moz-user-select&#39;:&#39;none&#39;,
&#39;-o-user-select&#39;:&#39;none&#39;,
&#39;-khtml-user-select&#39;:&#39;none&#39;, /* you could also put this in a class */
&#39;-webkit-user-select&#39;:&#39;none&#39;,/* and add the CSS class here instead */
&#39;-ms-user-select&#39;:&#39;none&#39;,
&#39;user-select&#39;:&#39;none&#39;
}).bind(&#39;selectstart&#39;, function(){
return false;
});
Nach dem Login kopieren


Das obige ist der detaillierte Inhalt vonCodebeispiel zum Deaktivieren von ausgewähltem Text über CSS-Regeln. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage