CSS DzR主样式表(第一部分,重置)
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了CSS DzR主样式表(第一部分,重置)相关的知识,希望对你有一定的参考价值。
/**************************************************************************************************/
/*This stylesheet was created for HTML 4.01 using CSS 3 (and older)
/*Tested on Windows versions of Firefox 1.5-3.0, IE 6-7, Safari 3.2, Opera 9.2-9.6, and K-Meleon 1.5
/*
/*I've put helpful classes into a separate stylesheet. PLEASE CUSTOMIZE THAT STYLESHEET AS NOTED!
/*IE-specific stylesheets include fixes or fallbacks for both of these stylesheets, so comment out relevant rules
/* if you won't be using the classes.
/*
/*Because of too many browser inconsistencies, I have:
/*- left the styling of form elements up to the browser (for the most part).
/*- not set the outline property on anything (e.g., `:focus`).
/*
/*Elements included:
/* Obsolete:
/* app, bgsound, blink, comment, listing, marquee, multicol, nobr, plaintext, sound, spacer, wbr, xmp
/* Deprecated:
/* applet, basefont, center, dir, font, isindex, menu, s, strike, u
/* Non-standard:
/* embed, noembed
/* Standard:
/* a, abbr, acronym, address, area, b, base, bdo, big, blockquote, body, br, button, caption, cite,
/* code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6,
/* head, hr, html, i, iframe, img, input, ins, kbd, label, legend, li, link, map, meta, noframes, noscript,
/* object, ol, optgroup, option, p, param, pre, q, samp, script, select, small, span, strong, style, sub, sup,
/* table, tbody, td, textarea, tfoot, th, thead, title, tr, tt, ul, var
/*
/*1.0: The Basics
/*2.0: Block-Level Elements
/* 2.1: Headers
/* 2.2: Lists
/* 2.3: Tables
/*3.0: Inline Elements
/* 3.1: Hyperlinks
/*4.0: Forms
/* 4.1: Buttons
/* 4.2: Text Inputs
/* 4.3: Choices
/*5.0: Media-Specific
/* 5.1: Paged Media
/* 5.2: Audible Media
/**************************************************************************************************/
/***********************/
/*** 1.0: The Basics ***/
/***********************/
bgsound, comment, sound { display:none; }
listing, xmp { white-space:pre; }
app, blink, listing, marquee, multicol, nobr, plaintext, spacer, wbr, xmp,
applet, center, dir, font, menu, s, strike, u,
embed, noembed,
a, abbr, acronym, address, b, big, blockquote, body, br, caption, cite, code, col, colgroup, dd, del, dfn, div, dl, dt, em,
fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, hr, html, i, iframe, img, ins, kbd, label, legend, li, map,
noframes, noscript, object, ol, optgroup, option, p, pre, q, samp, small, span, strong, sub, sup, table, tbody, td, tfoot,
th, thead, tr, tt, ul, var {
margin:0;
padding:0;
border:0 solid #000;
font-style:inherit;
font-weight:inherit;
font-size:inherit;
text-decoration:inherit;
background-color:transparent;
color:inherit;
line-height:1.25;
font-family:inherit;
text-align:inherit;
vertical-align:baseline;
}
html {
background-color:#FFF;
}
body {
padding:8px;
font-family:sans-serif;
font-size:95%; /*since sans-serif seems bigger*/
color:#000;
font-style:normal;
font-weight:normal;
text-decoration:none;
text-align:left;
}
/*********************************/
/*** 2.0: Block-Level Elements ***/
/*********************************/
p, ul, ol, dl, pre { margin:1em 0; }
p:first-child, blockquote:first-child, ul:first-child, ol:first-child, dl:first-child, pre:first-child { margin-top:0; }
p:last-child, blockquote:last-child, ul:last-child, ol:last-child, dl:last-child, pre:last-child { margin-bottom:0; }
pre {
font-family:"Envy Code R", "Consolas", "DejaVu Sans Mono", "Anonymous Pro", "Courier New", monospace;
}
blockquote {
margin:1em 1.25em;
quotes:none;
}
blockquote:before, blockquote:after { content:""; }
blockquote::before, blockquote::after { content:""; }
address { font-style:normal; }
center { text-align:center; }
/*** 2.1: Headers ***/
h1, h2, h3, h4, h5, h6 {
margin:1em 0;
font-weight:bold;
}
h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top:0; }
h1 {
font-size:2em;
margin-bottom:0.5em;
}
h2 {
font-size:1.7em;
margin-bottom:0.59em;
}
h3 {
font-size:1.4em;
margin-bottom:0.71em;
}
h4, h5, h6 {
font-size:1em;
}
hr {
margin:0.5em 0; /*no way to get rid of the margin in IE, so I'll include it for consistency*/
border-width:2px;
padding-top:1px;
border-style:solid;
border-color:#EAEAEA #BBB #676767 #EAEAEA;
background-color:#BBB;
color:#BBB; /*for IE*/
}
/*** 2.2: Lists ***/
ul { list-style-type:disc; }
ul ul { list-style-type:circle; }
ul ul ul { list-style-type:square; }
ul, ol, dir {
padding-left:1.25em;
list-style-position:outside;
}
ol { padding-left:2em; }
menu { list-style-type:none; }
dt { margin-top:0.5em; }
dt:first-child { margin-top:0; }
dd { margin-left:1.25em; }
/*** 2.3: Tables ***/
table {
border-collapse:collapse;
border-spacing:0;
}
caption {
caption-side:top;
text-align:center;
}
td { vertical-align:top; }
/****************************/
/*** 3.0: Inline Elements ***/
/****************************/
em, i, cite, var, dfn, ins { font-style:italic; }
strong, b { font-weight:bold; }
code, kbd, samp, tt, var {
font-family:"Envy Code R", "Consolas", "DejaVu Sans Mono", "Anonymous Pro", "Courier New", monospace;
}
code, var { background-color:#E6E6E6; }
samp { color:#444; }
del, strike, s { text-decoration:line-through; }
u { text-decoration:underline; }
/*Except for IE, browsers automatically add quotes around a `q` element; this removes them.*/
q:before, q:after { content:""; }
q::before, q::after { content:""; }
big { font-size:120%; } /*why isn't this deprecated?*/
small, sup, sub { font-size:80%; }
sup { vertical-align:super; }
sub { vertical-align:sub; }
/*** 3.1: Hyperlinks ***/
a img { border:0; }
/*
Browsers seem to ignore the implicit pseudo-classes for anchors in terms of specificity; you can override
them all at once with the selector `a` even though they are more specific. This is corrected when set explicity,
as below.
Note, however, that these will now be more tedious to override in other stylesheets.
*/
a:link {
text-decoration:underline;
color:#00E;
}
a:visited { color:#551A8B; }
a:focus { }
/*I don't use `a` elements as anchors (why would you?), so I won't make these selectors so specific*/
/*a:link:hover { }
a:link:active { color:#F00; }*/
a:hover { }
a:active { color:#F00; }
/******************/
/*** 4.0: Forms ***/
/******************/
fieldset {
display:block;
padding:0.5em;
border:1px solid #BBB; /*note: setting a border removes IE's curved corners*/
}
legend {
padding-left:3px;
padding-right:3px;
}
isindex {
display:block;
position:static;
}
input, button, select { vertical-align:middle; }
select[size], select[multiple], textarea { vertical-align:text-top; }
input[type="file"] {
}
/*** 4.1: Buttons ***/
input[type="submit"], input[type="reset"], input[type="button"],
button {
}
input[type="image"] {
}
/*** 4.2: Text Inputs ***/
input[type="text"], input[type="password"] {
}
textarea {
overflow:auto;
}
/*** 4.3: Choices ***/
input[type="checkbox"], input[type="radio"] {
}
select {
}
optgroup {
font-weight:bold;
font-style:italic;
}
optgroup option {
font-weight:normal;
font-style:normal;
padding-left:1em;
}
option {
padding-right:0.75em; /*for Firefox*/
}
option[disabled] {
color:#999;
}
/***************************/
/*** 5.0: Media-Specific ***/
/***************************/
/*audio, aural (deprecated), braille, embossed, handheld, print, projection, screen, speech, tty, tv*/
@media aural, braille, embossed, speech, tty {
/*img { content:attr(alt); } /*this is what's implied for relevant media, correct?*/
img[alt=""] { display:none; }
img:not([alt]) { display:none; }
}
@media handheld {
*, *:before, *:after { float:none !important; }
*, *::before, *::after { float:none !important; }
body {
padding:2px;
font-size:100%;
}
pre { white-space:pre-wrap; }
blockquote { margin:1em 0 1em 1em; }
dd { margin-left:1em; }
h1 { margin-top:0.5em; }
h2 { margin-top:0.59em; }
h3 { margin-top:0.71em; }
ul, ol {
padding-left:0;
list-style-position:inside;
}
img { max-width:100%; }
}
@media tv {
}
/*** 5.1: Paged Media ***/
@media embossed, print, projection, tv {
* {
page-break-before:auto;
page-break-inside:auto;
page-break-after:auto;
}
p, blockquote, li, dd, pre, h1, h2, h3, h4, h5, h6 {
orphans:2;
widows:2;
}
h1, h2, h3, h4, h5, h6 { page-break-after:avoid; }
dt { page-break-after:avoid; }
dd { page-break-before:avoid; }
table, address, a { page-break-inside:avoid; }
}
@media embossed, print {
body { padding:0; }
a { text-decoration:none; } /*consider making sure it is still distinguishable on a B&W printer or to a color-blind user*/
}
@media print {
html { background-color:transparent; }
body {
font-size:11pt;
font-family:"Times New Roman", Times, serif;
}
pre, code, kbd, samp, tt, var {
font-family:"Envy Code R", "Consolas", "DejaVu Sans Mono", "Anonymous Pro", "Courier New", monospace;
}
a:visited { color:#00E; }
a[href^="#"] { color:inherit; }
}
/*** 5.2: Audible Media ***/
@media aural { /*deprecated*/
* {
/*pause-before:0;
pause-after:0;
cue-before:none;
cue-after:none;
play-during:auto;*/
}
html { play-during:none; }
body {
voice-family:male;
/*speak:normal;
speak-punctuation:none;
speak-numeral:continuous;
volume:medium;
speech-rate:medium;
pitch:medium;
pitch-range:50;
stress:50;
richness:50;
azimuth:center;
elevation:level;*/
}
th, td { /*speak-header:once;*/ }
small { volume:soft; }
}
@media speech {
* {
/*voice-duration:;
phonemes:;
pause-before:;
pause-after:;
cue-before:none;
cue-after:none;
rest-before:;
rest-after:;
mark-before:none;
mark-after:none;*/
}
body {
voice-family:male;
/*voice-volume:medium;
voice-balance:center;
speak:normal;
voice-rate:;
voice-pitch:medium;
voice-pitch-range:;
voice-stress:moderate;*/
}
small { voice-volume:soft; }
}
@media audio {
}
以上是关于CSS DzR主样式表(第一部分,重置)的主要内容,如果未能解决你的问题,请参考以下文章