как можно заблокировать выделение текста или изменить курсор на указатель на определенный текст

Question

У меня есть кнопка в html, в которой есть фоновое изображение и текст поверх него, как я могу отключить выделение этого текста, чтобы он выглядел более "бесшовным"?

echo '<td width="130" height="30"'. "onClick='document.location = ".'"'.$value.'";'."'><center>".$key."</center></td></a>";

Answer 1

Используйте этот CSS:

#defaultPointer{
    cursor:default;
}

для этого div:

<div id="defaultPointer">
<p>
hello world
</p>
</div>

Просто образец, но он должен сделать Мак-Гоатса более безразличным. Я делал то же самое с сайтом раньше.

В вашем случае вы, вероятно, просто добавили бы идентификатор к тому, что у вас там есть.

Надеюсь, это поможет.

Answer 2

Чтобы стилизовать указатель мыши, вам нужно использовать стиль cursor CSS.

.normalpointer {
    cursor:default;
}

Это работает во всех браузерах. (Существует несколько типов указателей, которые могут быть стилизованы, но в старых браузерах возникают проблемы с кроссбраузерностью, но default определенно работает везде)

Отключить возможность выделения текста немного сложнее: вам нужно сделать несколько вещей, потому что поддержка браузера различна.

Для браузеров, которые поддерживают это через CSS, вам необходимо следующее:

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

т. Е. user:select:none; плюс куча вариантов, специфичных для браузера. Некоторые из этих специфичных для браузера вариантов, вероятно, могут быть отброшены сейчас, поскольку поддержка улучшилась, но если вы все равно сохраните их, вы сможете поддерживать людей, которые не обновляли свои браузеры в течение некоторого времени.

Я полагаю, что вышеизложенное также работает в IE9, но старые версии IE определенно не поддерживают его. Для этого вам нужно добавить следующий атрибут к элементу, который вы хотите сделать невыбираемым: unselectable="on"

Таким образом, невыбираемый div во всех браузерах будет выглядеть так:

<div class='unselectable' unselectabnle='on'>....</div>

(с классом, ссылающимся на приведенную выше таблицу стилей)

Альтернативой стилю user-select CSS будет использование ::selection CSS. Это позволяет вам стилизовать внешний вид текста при его выделении. Вы можете использовать это, например, чтобы текст выделения выглядел так же, как и обычный текст, что позволяло бы выделять текст, не изменяя его визуально:

.myclass::selection {
    background: transparent;
}

опять же, вам могут понадобиться некоторые таблицы стилей, специфичные для поставщика, для поддержки старых версий некоторых браузеров - например:

.myclass::-moz-selection {
    background: transparent;
}

Надеюсь, это поможет.

Answer 3

Если я правильно понял ваш вопрос, вы хотите, чтобы он вел себя как кнопка, просто добавьте в свой "тд" стиль:

style="cursor:pointer;"

Answer 4

Два способа сделать это

- Render the text as image as we have email in Facebook
- Overlay it with a Div with semi transparent image as a background