2012-12-28 27 views
8

In meiner Seite habe ich eine ganze div unselectable, mit Hilfe dieses cssMake Text wählbar innerhalb eines unselectable div

.unselectable { 
    -moz-user-select: -moz-none; 
    -khtml-user-select: none; 
    -webkit-user-select: none; 

    /* 
    Introduced in IE 10. 
    See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/ 
    */ 
    -ms-user-select: none; 
    user-select: none; 
} 

Jetzt ein h2-Tag in Ich habe (was ich von Stackoverflow es selbst bekam) gemacht Dieses nicht auswählbare div.Und ich möchte, dass h2 wählbar wird. Gibt es einen Weg, dies einfach zu erreichen.

Ich habe etwas in meiner Frage vergessen. Ich habe drei h2 in meinem Code und ich brauche bestimmte um auswählbar zu sein, also fügte ich eine Klasse zu diesem h2 hinzu und probierte etwas wie diese .unselectable: nicht (.class-of-h2) (was ich von unten Antworten bekam). aber seine Arbeit nicht

Antwort

17

Verwenden Sie Ihre h2 Element

.unselectable h2{ 
-moz-user-select: text; 
-khtml-user-select: text; 
-webkit-user-select: text; 
-ms-user-select: text; 
user-select: text; 
} 

See demo

+0

Ich weiß nicht, ob das die richtige Antwort ist oder nicht, aber dieses Ding hat definitiv für mich funktioniert. – Athul

+0

Ja, es scheint, dass Sie die Einstellung für ein Elternelement einfach auf diese Weise überschreiben können. Die [MDN-Seite auf 'user-select'] (https://developer.mozilla.org/en-US/docs/CSS/user-select?redirectlocale=en-US&redirectslug=CSS%2F-moz-user-select) ist etwas irreführend: im Allgemeinen 'none' erlaubt Übersteuerung in inneren Elementen, aber Firefox hat eine andere Einstellung:' none' erlaubt keine Überschreibungen, '-moz-none' tut es. –

1

Sie

 .unselectable:not(h2:nth-child(2)) { 
     //your data 
     } 

nicht kann das Element aus der Liste der Wähler ausschließen können
dies kann Ihre ganze div unselectable außer h2-Element machen.

+0

: Ich habe vergessen s Etwas in meiner Frage. Ich habe drei h2 in meinem Code und ich brauche bestimmte um auswählbar zu sein, so fügte ich eine Klasse zu diesem h2 und versuchte etwas wie diese .unselectable: nicht (.class-of-h2) .aber es funktioniert nicht – Athul

+0

Sie können benutze .unselectable: nicht (h2: nth-child (2)) so etwas .. – sourcecode

2

Fügen Sie einfach die unten CSS

.unselectable h2 { 
    -moz-user-select: text; 
    -khtml-user-select: auto; 
    -webkit-user-select: auto ; 
    -ms-user-select: auto; 
    user-select: auto; 
} 

Siehe demo