CSS to only allow selection of text on a webpage?
Is there a lightweight CSS or Javascript snippet that will allow me only make the selection/highlighting of things 开发者_StackOverflowon a page only available to text? It's always annoyed me when you're trying to highlight text and you end up highlighting divs and images and things.
Is there a way ONLY to highlight text? That would include paragraph, anchors, text inside divs & images, and all header tags.
Thanks! ~ Jackson
I'm uploading the results anyone who who answers this, I'm currently running @Nick Radford 's code he ETA'd.
Here it is, and it's closer, still a lot of selection besides text going on with ctrl+a: http://designsweeter.com/
html{
-o-user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
}
p,a,h1,h2,h3,h4,h5,h6,div,br,li,td,article{
-o-user-select: text;
-moz-user-select: text;
-webkit-user-select: text;
user-select: text;
}
The first block disables selection in html, the second re-enables it to any item that can contain text as of HTML5. It's pretty big, but minified, it's smaller:
html{-moz-user-select:none;-o-user-select:none;-webkit-user-select:none;user-select:none}p,a,h1,h2,h3,h4,h5,h6,div,br,li,td,article{-moz-user-select:text;-o-user-select:text;-webkit-user-select:text;user-select:text}
this might work:
img, div {
-o-user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
}
精彩评论