draggable = "false" не работает при выборе пользователя: в CSS ничего не указано - PullRequest
Новая
       18

draggable = "false" не работает при выборе пользователя: в CSS ничего не указано

0 голосов
/ 27 мая 2020

У меня есть текстовая ссылка, которую я использую как lo go для сайта, и я не хочу, чтобы ссылку можно было перетаскивать или выбирать (чисто из эстетических соображений, это будет только локальный сайт) . Я собирался спросить, почему draggable="false" не работает, но потом я обнаружил, что если я удалил user-select: none; из CSS, он работал нормально. Вот мой код (примечание: текст должен быть черным без text-decoration, но это не нужно определять, потому что я также использую таблицу стилей сброса): 

.logo {
    padding: 1.5em;
    text-align: center;
    user-select: none;
}

.heading {
    font-family: 'Yeseva One', serif;
    font-size: 3em;
}

.heading a {
    transition: 200ms;
}

.heading a:hover {
    color: #c1250f;
}
<div class="logo">
    <h1 class="heading"><a href="#" draggable="false">Title</a></h1>
</div>

У вас есть идеи, почему они не работают вместе? И есть ли способ исправить?

Спасибо.

1 Ответ

0 голосов
/ 28 мая 2020

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

.logo {
    padding: 1.5em;
    text-align: center;
    user-select: none;
}

.heading {
    font-family: 'Yeseva One', serif;
    font-size: 3em;
}

.heading a {
    transition: 200ms;
}

.heading a:hover {
    color: #c1250f;
}

.no-drag {
cursor: none;
}
<div class="logo">
    <h1 class="heading"><a class="no-drag" href="#" draggable="false">Title</a></h1>
</div>
...