Откуда берутся стили для появления webkit? - PullRequest
0 голосов
/ 04 октября 2019

Я понимаю основную идею свойства -webkit-appearance и то, как он применяет стилевое оформление к элементу. Но я не понимаю, где определены эти платформенные стили. Я думал, что они могут быть в таблице стилей агента пользователя, но нет стилей, которые делают, например, <input type="date" /> похожим на это в мобильном Safari:

enter image description here

Вы можете просмотреть таблицу стилей пользовательского агента Safari здесь , которая не включает (насколько мне известно) стили, которые делают ввод с типом отображения даты, как на изображении выше.

Похоже, что большая часть стилизации выполняется с помощью одного свойства CSS в таблице стилей агента пользователя, а именно:

-webkit-appearance: menulist-button;

Это резко меняет визуальный вывод ввода в мобильном Safari, чтобы он выглядел какпример изображения.

Откуда эти стили, если не из таблицы стилей агента пользователя?

1 Ответ

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

После долгих исследований и поиска исходного кода Webkit я нашел ответ.

В контексте браузеров на основе Webkit элементы, к которым применено свойство CSS appearance, не применяются получают свои родные для платформы стили из таблицы стилей пользовательского агента браузера. Эти стили определены вне таблицы стилей UA в файле renderTheme, который является частью внутренних компонентов механизма Webkit.

Например, вы можете найти стили, которые я запрашивал, в моем исходном вопросе, который был определенздесь: https://trac.webkit.org/browser/webkit/trunk/Source/WebCore/rendering/RenderThemeIOS.mm#L623

Чтобы разбить все это: в мобильном Safari <input type="date" /> получает -webkit-appearance: menulist-button из таблицы стилей агента пользователя Safari. Дополнительный стиль, примененный -webkit-appearance: menulist-button, который не является в таблице стилей пользовательского агента , определен в файле renderTheme Webkit.

...