Как отключить синий выбор при двойном щелчке, в заголовке таблицы?

Question

Я следовал за структуру заголовка таблицы:

<th> 
<a ng-click="sort_by(order)" style="color: #555555;"> 
    <span ng-transclude=""> 
     <span class="ng-scope">Some text</span> 
    </span> 
    <i class="icon-chevron-down"></i> 
</a> 
</th> 

Проблема, когда я дважды щелкните по ссылке заголовка, фон выбран (синий цвет) и кажется грязным.

Как избежать такого поведения?

Спасибо,

Answer 1

Вы можете использовать user-select:none, который отключит выбор th элемента.

jsFiddle example - попробуйте выделить элемент.

th { 
    -moz-user-select: none; 
    -webkit-user-select: none; 
    -ms-user-select: none; 
    user-select: none; 
} 

Поддержка этого свойства можно найти here.

---

Если вы обеспокоены поддержкой, вы могли бы использовать в качестве альтернативы ::selection изменить цвет от синего до прозрачного. Этот метод имеет меньшую немного поддержки.

jsFiddle example - попробуйте выделить элемент.

th::selection { 
    color:transparent; 
} 
th::-moz-selection { 
    color:transparent; 
} 

Поддерживается в IE9. Reference here.