Как я могу стиль <button>, чтобы он был на вид как <span>? Без замедления рендеринга и т. Д. - PullRequest
Новая
       41

Как я могу стиль <button>, чтобы он был на вид как <span>? Без замедления рендеринга и т. Д.

0 голосов
/ 29 октября 2019

Я думаю о замене <span> на <button> по причинам доступности. Я хочу, чтобы элемент отображался как сейчас. CSS для этого выглядит примерно так (пожалуйста, добавьте к нему, если вы видите, что чего-то не хватает): 

button {
    background: none;
    border: 0;
    color: inherit;
    font: inherit;
    line-height: normal;
    overflow: visible;
    padding: 0;
}

Поскольку в моем приложении очень много таких промежутков (думаю тысячи), мне интересно, замедляется ли эторендеринг и т. д. (в Chrome в более новом Firefox)?

Скажите, пожалуйста, почему он замедляется или не замедляется рендеринг и т. д.

РЕДАКТИРОВАТЬ: я получил комментарий, что он можетТрудно понять, почему я это делаю. Это хороший комментарий!

Причина в том, что если я использую <button> вместо <span>, мне не нужно добавлять обработчик клавиатуры для элемента и делать элемент фокусируемым. В большинстве случаев это выполняется браузером автоматически для <button>. (это необходимо для доступности.)

1 Ответ

2 голосов
/ 30 октября 2019

Поскольку в моем приложении очень много таких диапазонов (думаю, тысяч), мне интересно, замедляет ли это рендеринг и т. Д. (В Chrome в более новом Firefox)?

Нет, он не замедляетсярендеринг. Браузеры действительно используют определения CSS.

по соображениям доступности

Указание WCAG Нетекстовый контраст предоставляет интересную информацию о контрасте цвета между элементами управления вводом иПрилегающий текст, о котором вам следует позаботиться, так как вы удаляете все границы.

...