为用户登录过程配置公司品牌，可在使用 Microsoft Entra ID 作为标识和访问管理服务的应用程序中提供无缝体验。 如果在自定义公司品牌打造过程中使用 CSS 模板，可使用此 CSS 引用指南。
HTML 选择器
以下 CSS 样式已成为整个页面的默认正文和链接样式。 应用其他链接或文本的样式会替代 CSS 选择器。
body- 用于整个页面的样式- 链接的样式：
a, a:link- 所有链接a:hover- 当鼠标悬停在链接上时a:focus- 当链接具有焦点时a:focus:hover- 当链接具有焦点 且 鼠标位于链接上方时a:active- 在单击链接时
Microsoft Entra CSS 选择器
使用以下 CSS 选择器配置登录体验的详细信息。
.ext-background-image- 包含默认灯箱模板中背景图像的容器.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- 页面底部页脚中的调试详细信息省略号