浏览器默认样式：User Agent Style Sheet

最新推荐文章于 2024-10-11 10:28:06 发布

SuperWiwi

最新推荐文章于 2024-10-11 10:28:06 发布

阅读量794

点赞数

分类专栏： Web开发

本文链接：https://blog.csdn.net/qq_36622009/article/details/113179681

版权

Web开发专栏收录该内容

14 篇文章

订阅专栏

本文介绍了浏览器默认样式，即User Agent Style Sheet。通过F12开发者工具，可以查看Firefox、Chrome和Safari的UA样式，但Internet Explorer的不可见。内容包括解释默认样式的概念，并以input元素的focus状态为例进行说明。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

文章目录

1.什么是浏览器默认样式？

如图所示，F12开发者工具中可以看到当前的样式用到的CSS是什么：user agent stylesheet
在这里插入图片描述

2.如何获取到对应的css？

Mozilla Firefox: https://dxr.mozilla.org/mozilla-central/source/layout/style/res/html.css
Google Chrome: https://chromium.googlesource.com/chromium/blink/+/master/Source/core/css/html.css
Safari (WebKit): https://trac.webkit.org/browser/trunk/Source/WebCore/css/html.css
Internet Explorer: You can’t view Internet Explorer’s UA Stylesheet because it’s not open source.

3.如何理解默认样式？

比如：

input元素的focus状态：

/* focusable content: anything w/ tabindex >=0 is focusable */
:-moz-focusring {
  /* Don't specify the outline-color, we should always use initial value. */
   outline: 1px dotted;
}

iframe:-moz-focusring,
body:-moz-focusring,
html:-moz-focusring {
  /* These elements historically don't show outlines when focused by default.
   * We could consider changing that if needed. */
  outline-style: none;
}