Справочник по шаблону CSS

Настройка фирменной символики компании для процесса входа пользователя обеспечивает простой интерфейс в приложениях, использующих идентификатор Microsoft Entra в качестве службы управления удостоверениями и доступом. Используйте это справочное руководство по CSS, если вы используете шаблон CSS CSS в рамках процесса настройки фирменно й символики компании.

Селекторы HTML

Следующие стили CSS становятся стилями текста и ссылок по умолчанию для всей страницы. Применение стилей для других ссылок или текстовых переопределения селекторов CSS.

• body — стили для всей страницы
• Стили для ссылок:
  • a, a:link — все ссылки
  • a:hover — когда указатель мыши находится по ссылке
  • a:focus — если ссылка имеет фокус
  • a:focus:hover — если ссылка имеет фокус и мышь находится по ссылке
  • a:active . При щелчке ссылки

Селекторы CSS Microsoft Entra

Используйте следующие селекторы CSS, чтобы настроить сведения о интерфейсе входа.

• .ext-background-image — контейнер, содержащий фоновое изображение в шаблоне lightbox по умолчанию

• .ext-header — заголовок в верхней части контейнера

• .ext-header-logo — логотип заголовка в верхней части контейнера

  

• .ext-middle — стиль для полноэкранного фона, который выравнивает поле входа по вертикали до середины и горизонтально до центра.

• .ext-vertical-split-main-section — стиль контейнера частичноэкранного фона в шаблоне вертикального разделения, который содержит окно входа и фон (этот стиль также называется шаблоном служб федерации Active Directory (ADFS).

• .ext-vertical-split-background-image-container — фон входа в шаблоне вертикального разделения или ADFS

• .ext-sign-in-box — контейнер поля входа

• .ext-title — текст заголовка

  

• .ext-subtitle — текст субтитров

• Стили для основных кнопок:

  • .ext-button.ext-primary — стиль основной кнопки по умолчанию
  • .ext-button.ext-primary:hover — когда наведите указатель мыши на кнопку
  • .ext-button.ext-primary:focus — когда кнопка имеет фокус
  • .ext-button.ext-primary:focus:hover . Если кнопка имеет фокус и мышь переверхла кнопку
  • .ext-button.ext-primary:active . Когда кнопка нажимается

  

• Стили для дополнительных кнопок:

  • .ext-button.ext-secondary — вторичные кнопки
  • .ext-button.ext-secondary:hover — когда наведите указатель мыши на кнопку
  • .ext-button.ext-secondary:focus Когда кнопка имеет фокус
  • .ext-button.ext-secondary:focus:hover . Если кнопка имеет фокус и мышь переверхла кнопку
  • .ext-button.ext-secondary:active . Когда кнопка нажимается

  

• .ext-error — текст ошибки

  

• Стили для текстовых полей:

  • .ext-input.ext-text-box — текстовые поля
  • .ext-input.ext-text-box.ext-has-error . При возникновении ошибки проверки, связанной с текстовым полем
  • .ext-input.ext-text-box:hover — когда мышь перенастила текстовое поле
  • .ext-input.ext-text-box:focus . Если текстовое поле имеет фокус
  • .ext-input.ext-text-box:focus:hover. Если текстовое поле имеет фокус и мышь перекрестит текстовое поле

  

• .ext-boilerplate-text — текст пользовательского сообщения в нижней части поля входа

• .ext-promoted-fed-cred-box — текстовое поле параметров входа

  

• Стили нижнего колонтитула:

  • .ext-footer — область нижнего колонтитула в нижней части страницы
  • .ext-footer-links — область ссылок в нижней части страницы
  • .ext-footer-item — связывание элементов (таких как "Условия использования" или "Файлы cookie & конфиденциальности") в нижней части страницы
  • .ext-debug-item — многоточие сведений отладки в нижней части страницы