css3中user-select的用法详解

html-css011

css3中user-select的用法详解,第1张

user-select属性是css3新增的属性，用于设置用户是否能够选中文本。可用于除替换元素外的所有元素，以下是user-select的主要用法和注意事项的说明，更多信息可参考如下css3文档说明。

参考资料：

https://www.cnblogs.com/10manongit/p/12913477.html

目前在select元素中你使用css: text-align, 你会发现根本不起作用。

select { text-align: right }option { text-align: right }

似乎在所有基于webkit的浏览器没有对select实现text-align这个CSS属性。

这里有一些临时的解决方案

1) 简单点的使用padding使其“看上去”对齐

比如： 这里比较适合宽度固定的场合，只要padding合适，效果还是不错的

select { ... padding: 0 0 0 20px}

示例 http://jsfiddle.net/P5k4D/1/

2） 使用一些UI库实现

比如jQueryUI的select menu

优点是可以解决select控制在各个浏览器界面不一致的问题。

3） 居右对齐：　可以使用rtl属性来来控制，

<select dir="rtl"> <option>Foo</option> <option>bar</option> <option>to the right</option></select>

写成CSS的话则为：

select {direction: rtl}