编辑:正如@geca在评论中指出的,这是一个已知的
WebKit bug.让我们希望它很快得到修复!
:: selection伪元素允许对所选文本进行样式化。这可以按预期方式工作,但不适用于Google Chrome 15中的文本区域和输入。
(我不知道这是否是一个webkit或chrome问题,因为我不能在Linux上使用Safari。)
这是一个jsfiddle演示这个问题:http://jsfiddle.net/J5N7K/2/
参考图片中选定的文字应该是样式。 textarea和input中的选定文本不是。 (但是在Firefox。)
我做错了什么,现在不可能在Chrome上进行风格化吗?
解决方法
是< div>有一个可选的选项?功能只列出< textarea>对于大多数事情
演示:http://jsfiddle.net/ThinkingStiff/FcCgA/
HTML:
<textarea><textarea> Doesn't highlight properly in Chrome.</textarea><br /> <input value="<input> Doesn't highlight properly in Chrome." /> <p><p> Highlights just fine in Chrome!</p> <div id="div-textarea" contenteditable><div contenteditable> Highlights just fine in Chrome!</div>
CSS:
textarea,input,p,div { width: 400px; } #div-textarea { -webkit-appearance: textarea; height: 32px; overflow: auto; resize: both; } ::selection { background-color: black; color: white; }
输出(Chrome):