Browsers' Default CSS Stylesheets

Browsers' default CSS for HTML elements

A GitHub repository of all W3C HTML spec and vendor default CSS stylesheets can be found here

  1. Default Styles for Gecko / Firefox
    --
  2. Default Styles for Internet Explorer
    --
  3. Default Styles for Webkit / Safari
    --
  4. Default Styles for Blink / Chrome
    --
  5. Default Styles for Opera
    --
  6. Default Styles for HTML4 (W3C spec)
    --
  7. Default Styles for HTML5 (W3C spec)
    --

Sample, per the default W3C HTML4 spec:

html, address,
blockquote,
body, dd, div,
dl, dt, fieldset, form,
frame, frameset,
h1, h2, h3, h4,
h5, h6, noframes,
ol, p, ul, center,
dir, hr, menu, pre { display: block; unicode-bidi: embed }
li { display: list-item }
head { display: none }
table { display: table }
tr { display: table-row }
thead { display: table-header-group }
tbody { display: table-row-group }
tfoot { display: table-footer-group }
col { display: table-column }
colgroup { display: table-column-group }
td, th { display: table-cell }
caption { display: table-caption }
th { font-weight: bolder; text-align: center }
caption { text-align: center }
body { margin: 8px }
h1 { font-size: 2em; margin: .67em 0 }
h2 { font-size: 1.5em; margin: .75em 0 }
h3 { font-size: 1.17em; margin: .83em 0 }
h4, p,
blockquote, ul,
fieldset, form,
ol, dl, dir,
menu { margin: 1.12em 0 }
h5 { font-size: .83em; margin: 1.5em 0 }
h6 { font-size: .75em; margin: 1.67em 0 }
h1, h2, h3, h4,
h5, h6, b,
strong { font-weight: bolder }
blockquote { margin-left: 40px; margin-right: 40px }
i, cite, em,
var, address { font-style: italic }
pre, tt, code,
kbd, samp { font-family: monospace }
pre { white-space: pre }
button, textarea,
input, select { display: inline-block }
big { font-size: 1.17em }
small, sub, sup { font-size: .83em }
sub { vertical-align: sub }
sup { vertical-align: super }
table { border-spacing: 2px; }
thead, tbody,
tfoot { vertical-align: middle }
td, th, tr { vertical-align: inherit }
s, strike, del { text-decoration: line-through }
hr { border: 1px inset }
ol, ul, dir,
menu, dd { margin-left: 40px }
ol { list-style-type: decimal }
ol ul, ul ol,
ul ul, ol ol { margin-top: 0; margin-bottom: 0 }
u, ins { text-decoration: underline }
br:before { content: "\A"; white-space: pre-line }
center { text-align: center }
:link, :visited { text-decoration: underline }
:focus { outline: thin dotted invert }

/* Begin bidirectionality settings (do not change) */
BDO[DIR="ltr"] { direction: ltr; unicode-bidi: bidi-override }
BDO[DIR="rtl"] { direction: rtl; unicode-bidi: bidi-override }

*[DIR="ltr"] { direction: ltr; unicode-bidi: embed }
*[DIR="rtl"] { direction: rtl; unicode-bidi: embed }

@media print {
h1 { page-break-before: always }
h1, h2, h3,
h4, h5, h6 { page-break-after: avoid }
ul, ol, dl { page-break-before: avoid }
}

Browsers' default CSS stylesheets

Not tabular, but the source CSS may be helpful if you're looking for something specific:

  • Firefox default HTML stylesheet
  • WebKit default HTML stylesheet

You're on your own with IE and Opera though.

Remove browser default styling !DOCTYPE

Doctype is not used for styling. There are two prominent ways of removing all the styles and uniforming the default look.

  1. normalize.css https://necolas.github.io/normalize.css/
  2. reset.css http://meyerweb.com/eric/tools/css/reset/

add these styles to your css before your stylesheet to uniform you layout to a certain degree, across different browsers.
What is the difference between Normalize.css and Reset CSS?

How can I check the default css settings of a browser?

You can't really do that. You may be able to find reference guides if you Google it, but they would probably be guess-work. Your best option is probably to use a CSS Reset to make sure every browser is reset to the same CSS, then you have a good base to build on.

Eric Meyer's reset is my favourite: http://meyerweb.com/eric/tools/css/reset/

What is the difference between default, user and author style sheets?

Default style sheets are supplied by the browser vendor.

User style sheets are supplied by the user of the browser.

Author style sheets are supplied by the author of a webpage.



Related Topics



Leave a reply



Submit