Der eigene Onlineshop für Fotografen

Workshop HTML5 & CSS3 - Stephan Heller

Firefox Default-CSS

/* ***** BEGIN LICENSE BLOCK *****
 * Version: MPL 1.1/GPL 2.0/LGPL 2.1
 *
 * The contents of this file are subject to the Mozilla Public License Version
 * 1.1 (the "License"); you may not use this file except in compliance with
 * the License. You may obtain a copy of the License at
 * http://www.mozilla.org/MPL/
 *
 * Software distributed under the License is distributed on an "AS IS" basis,
 * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
 * for the specific language governing rights and limitations under the
 * License.
 *
 * The Original Code is mozilla.org code.
 *
 * The Initial Developer of the Original Code is
 * Netscape Communications Corporation.
 * Portions created by the Initial Developer are Copyright (C) 1998
 * the Initial Developer. All Rights Reserved.
 *
 * Contributor(s):
 *   Blake Ross <BlakeR1234@aol.com>
 *
 * Alternatively, the contents of this file may be used under the terms of
 * either of the GNU General Public License Version 2 or later (the "GPL"),
 * or the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
 * in which case the provisions of the GPL or the LGPL are applicable instead
 * of those above. If you wish to allow use of your version of this file only
 * under the terms of either the GPL or the LGPL, and not to allow others to
 * use your version of this file under the terms of the MPL, indicate your
 * decision by deleting the provisions above and replace them with the notice
 * and other provisions required by the GPL or the LGPL. If you do not delete
 * the provisions above, a recipient may use your version of this file under
 * the terms of any one of the MPL, the GPL or the LGPL.
 *
 * ***** END LICENSE BLOCK ***** */
 
@namespace url(http://www.w3.org/1999/xhtml); /* set default namespace to HTML */
@namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
 
/* bidi */
 
[dir="rtl"] {
   direction: rtl;
   unicode-bidi: embed;
}
[dir="ltr"] {
   direction: ltr;
   unicode-bidi: embed;
}
bdi, bdi[dir], output, output[dir], [dir="auto"] { 
   unicode-bidi: -moz-isolate;
}
bdo, bdo[dir] {
   unicode-bidi: bidi-override;
}
bdo[dir="auto"] {
   unicode-bidi: bidi-override -moz-isolate;
}
textarea[dir="auto"], pre[dir="auto"] { unicode-bidi: -moz-plaintext; }
 
/* To ensure http://www.w3.org/TR/REC-html40/struct/dirlang.html#style-bidi:
 *
 * "When a block element that does not have a dir attribute is transformed to
 * the style of an inline element by a style sheet, the resulting presentation
 * should be equivalent, in terms of bidirectional formatting, to the
 * formatting obtained by explicitly adding a dir attribute (assigned the
 * inherited value) to the transformed element." */
 
address,
article,
aside,
blockquote,
body,
caption,
center,
col,
colgroup,
dd,
dir,
div,
dl,
dt,
fieldset,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
hr,
html,
li,
listing,
map,
marquee,
menu,
nav,
noframes,
ol,
p,
plaintext,
pre,
section,
table,
tbody,
td,
tfoot,
th,
thead,
tr,
ul,
xmp {
   unicode-bidi: -moz-isolate;
}
 
 
/* blocks */
 
article,
aside,
div,
dt,
figcaption,
footer,
form,
header,
hgroup,
html,
map,
nav,
section {
   display: block;
}
 
body {
   display: block;
   margin: 8px;
}
 
p, dl, multicol {
   display: block;
   margin: 1em 0;
}
 
dd {
   display: block;
   -moz-margin-start: 40px;
}
 
blockquote, figure {
   display: block;
   margin: 1em 40px;
}
 
address {
   display: block;
   font-style: italic;
}
 
center {
   display: block;
   text-align: -moz-center;
}
 
blockquote[type=cite] {
   display: block;
   margin: 1em 0px;
   -moz-padding-start: 1em;
   -moz-border-start: solid;
   border-color: blue;
   border-width: thin;
}
 
span[_moz_quote=true] {
   color: blue;
}
 
pre[_moz_quote=true] {
   color: blue;
}
 
h1 {
   display: block;
   font-size: 2em;
   font-weight: bold;
   margin: .67em 0;
}
 
h2,
:-moz-any(article, aside, nav, section)
h1 {
   display: block;
   font-size: 1.5em;
   font-weight: bold;
   margin: .83em 0;
}
 
h3,
:-moz-any(article, aside, nav, section)
:-moz-any(article, aside, nav, section)
h1 {
   display: block;
   font-size: 1.17em;
   font-weight: bold;
   margin: 1em 0;
}
 
h4,
:-moz-any(article, aside, nav, section)
:-moz-any(article, aside, nav, section)
:-moz-any(article, aside, nav, section)
h1 {
   display: block;
   font-size: 1.00em;
   font-weight: bold;
   margin: 1.33em 0;
}
 
h5,
:-moz-any(article, aside, nav, section)
:-moz-any(article, aside, nav, section)
:-moz-any(article, aside, nav, section)
:-moz-any(article, aside, nav, section)
h1 {
   display: block;
   font-size: 0.83em;
   font-weight: bold;
   margin: 1.67em 0;
}
 
h6,
:-moz-any(article, aside, nav, section)
:-moz-any(article, aside, nav, section)
:-moz-any(article, aside, nav, section)
:-moz-any(article, aside, nav, section)
:-moz-any(article, aside, nav, section)
h1 {
   display: block;
   font-size: 0.67em;
   font-weight: bold;
   margin: 2.33em 0;
}
 
listing {
   display: block;
   font-family: -moz-fixed;
   font-size: medium;
   white-space: pre;
   margin: 1em 0;
}
 
xmp, pre, plaintext {
   display: block;
   font-family: -moz-fixed;
   white-space: pre;
   margin: 1em 0;
}
 
/* tables */
 
table {
   display: table;
   border-spacing: 2px;
   border-collapse: separate;
   margin-top: 0;
   margin-bottom: 0;
   /* XXXldb do we want this if we're border-collapse:collapse ? */
   -moz-box-sizing: border-box;
   text-indent: 0;
}
 
table[align="left"] {
   float: left;
}
 
table[align="right"] {
   float: right;
   text-align: start;
}
 
 
/* border collapse rules */
 
/* Set hidden if we have 'frame' or 'rules' attribute.
   Set it on all sides when we do so there's more consistency
   in what authors should expect */
 
/* Put this first so 'border' and 'frame' rules can override it. */
table[rules] { 
   border-width: thin;
   border-style: hidden;
}
 
/* 'border' before 'frame' so 'frame' overrides
    A border with a given value should, of course, pass that value
    as the border-width in pixels -> attr mapping */
 
/* :-moz-table-border-nonzero is like [border]:not([border="0"]) except it
   also checks for other zero-like values according to HTML attribute
   parsing rules */
table:-moz-table-border-nonzero { 
   border-width: thin;
   border-style: outset;
}
 
table[frame] {
   border: thin hidden;
}
 
/* specificity must beat table:-moz-table-border-nonzero rule above */
table[frame="void"]   { border-style: hidden; }
table[frame="above"]  { border-style: outset hidden hidden hidden; }
table[frame="below"]  { border-style: hidden hidden outset hidden; }
table[frame="lhs"]    { border-style: hidden hidden hidden outset; }
table[frame="rhs"]    { border-style: hidden outset hidden hidden; }
table[frame="hsides"] { border-style: outset hidden; }
table[frame="vsides"] { border-style: hidden outset; }
table[frame="box"],
table[frame="border"] { border-style: outset; }
 
 
/* Internal Table Borders */
 
/* 'border' cell borders first */
 
table:-moz-table-border-nonzero > * > tr > td,
table:-moz-table-border-nonzero > * > tr > th,
table:-moz-table-border-nonzero > * > td,
table:-moz-table-border-nonzero > * > th,
table:-moz-table-border-nonzero > td,
table:-moz-table-border-nonzero > th
{
   border-width: thin;
   border-style: inset;
}
 
/* collapse only if rules are really specified */
table[rules]:not([rules="none"]):not([rules=""]) {
   border-collapse: collapse;
}
 
/* only specified rules override 'border' settings  
  (increased specificity to achieve this) */
table[rules]:not([rules=""])> tr > td,
table[rules]:not([rules=""])> * > tr > td,
table[rules]:not([rules=""])> tr > th,
table[rules]:not([rules=""])> * > tr > th,
table[rules]:not([rules=""])> td,
table[rules]:not([rules=""])> th
{
   border-width: thin;
   border-style: none;
}
 
 
table[rules][rules="none"]  > tr > td,
table[rules][rules="none"] > * > tr > td,
table[rules][rules="none"] > tr > th,
table[rules][rules="none"] > * > tr > th,
table[rules][rules="none"] > td,
table[rules][rules="none"] > th
{
   border-width: thin;
   border-style: none;
}
 
table[rules][rules="all"] > tr > td,
table[rules][rules="all"] > * > tr > td,
table[rules][rules="all"] > tr > th,
table[rules][rules="all"] > * > tr > th,
table[rules][rules="all"] > td,
table[rules][rules="all"] > th 
{
   border-width: thin;
   border-style: solid;
}
 
table[rules][rules="rows"] > tr,
table[rules][rules="rows"] > * > tr {
   border-top-width: thin;
   border-bottom-width: thin;
   border-top-style: solid;
   border-bottom-style: solid;
}
 
 
table[rules][rules="cols"] > tr > td,
table[rules][rules="cols"] > * > tr > td,
table[rules][rules="cols"] > tr > th,
table[rules][rules="cols"] > * > tr > th {
   border-left-width: thin;
   border-right-width: thin;
   border-left-style: solid;
   border-right-style: solid;
}
 
table[rules][rules="groups"] > colgroup {
   border-left-width: thin;
   border-right-width: thin;
   border-left-style: solid;
   border-right-style: solid;
}
table[rules][rules="groups"] > tfoot,
table[rules][rules="groups"] > thead,
table[rules][rules="groups"] > tbody {
   border-top-width: thin;
   border-bottom-width: thin;
   border-top-style: solid;
   border-bottom-style: solid;
}
 
 
/* caption inherits from table not table-outer */  
caption {
   display: table-caption;
   text-align: center;
   -moz-box-sizing: border-box;
}
 
table[align="center"] > caption {
   margin-left: auto;
   margin-right: auto;
}
 
table[align="center"] > caption[align="left"] {
   margin-right: 0;
}
 
table[align="center"] > caption[align="right"] {
   margin-left: 0;
}
 
tr {
   display: table-row;
   vertical-align: inherit;
}
 
col {
   display: table-column;
}
 
colgroup {
   display: table-column-group;
}
 
tbody {
   display: table-row-group;
   vertical-align: middle;
}
 
thead {
   display: table-header-group;
   vertical-align: middle;
}
 
tfoot {
   display: table-footer-group;
   vertical-align: middle;
}
 
/* for XHTML tables without tbody */
table > tr {
   vertical-align: middle;
}
 
td { 
   display: table-cell;
   vertical-align: inherit;
   text-align: inherit; 
   padding: 1px;
}
 
th {
   display: table-cell;
   vertical-align: inherit;
   font-weight: bold;
   padding: 1px;
}
 
tr > form:-moz-is-html, tbody > form:-moz-is-html,
thead > form:-moz-is-html, tfoot > form:-moz-is-html,
table > form:-moz-is-html {
   /* Important: don't show these forms in HTML */
   display: none !important;
}
 
table[bordercolor] > tbody,
table[bordercolor] > thead,
table[bordercolor] > tfoot,
table[bordercolor] > col,
table[bordercolor] > colgroup,
table[bordercolor] > tr,
table[bordercolor] > * > tr,
table[bordercolor]  > tr > td,
table[bordercolor] > * > tr > td,
table[bordercolor]  > tr > th,
table[bordercolor] > * > tr > th {
   border-color: inherit;
}
 
/* inlines */
 
q:before {
   content: open-quote;
}
 
q:after {
   content: close-quote;
}
 
b, strong {
   font-weight: bolder;
}
 
i, cite, em, var, dfn {
   font-style: italic;
}
 
tt, code, kbd, samp {
   font-family: -moz-fixed;
}
 
u, ins {
   text-decoration: underline;
}
 
s, strike, del {
   text-decoration: line-through;
}
 
blink {
   text-decoration: blink;
}
 
big {
   font-size: larger;
}
 
small {
   font-size: smaller;
}
 
sub {
   vertical-align: sub;
   font-size: smaller;
   line-height: normal;
}
 
sup {
   vertical-align: super;
   font-size: smaller;
   line-height: normal;
}
 
nobr {
   white-space: nowrap;
}
 
mark {
   background: yellow;
   color: black;
}
 
/* titles */
abbr[title], acronym[title] {
   border-bottom: dotted 1px;
}
 
/* lists */
 
ul, menu, dir {
   display: block;
   list-style-type: disc;
   margin: 1em 0;
   -moz-padding-start: 40px;
}
 
menu[type="context"] {
   display: none !important;
}
 
ol {
   display: block;
   list-style-type: decimal;
   margin: 1em 0;
   -moz-padding-start: 40px;
}
 
li {
   display: list-item;
}
 
/* nested lists have no top/bottom margins */
:-moz-any(ul, ol, dir, menu, dl) ul,
:-moz-any(ul, ol, dir, menu, dl) ol,
:-moz-any(ul, ol, dir, menu, dl) dir,
:-moz-any(ul, ol, dir, menu, dl) menu,
:-moz-any(ul, ol, dir, menu, dl) dl {
   margin-top: 0;
   margin-bottom: 0;
}
 
/* 2 deep unordered lists use a circle */
:-moz-any(ol, ul, menu, dir) ul,
:-moz-any(ol, ul, menu, dir) menu,
:-moz-any(ol, ul, menu, dir) dir {
   list-style-type: circle;
}
 
/* 3 deep (or more) unordered lists use a square */
:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) ul,
:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) menu,
:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) dir {
   list-style-type: square;
}
 
 
/* leafs */
 
/* <hr> noshade and color attributes are handled completely by
 * the nsHTMLHRElement attribute mapping code
*/
hr {
   display: block;
   height: 2px;
   border: 1px inset;
   margin: 0.5em auto 0.5em auto;
   color: gray;
   -moz-float-edge: margin-box;
   -moz-box-sizing: border-box;
}
 
hr[size="1"] {
   border-style: solid none none none;
}
 
img:-moz-broken::before, input:-moz-broken::before,
img:-moz-user-disabled::before, input:-moz-user-disabled::before,
img:-moz-loading::before, input:-moz-loading::before,
applet:-moz-empty-except-children-with-localname(param):-moz-broken::before,
applet:-moz-empty-except-children-with-localname(param):-moz-user-disabled::before {
   content: -moz-alt-content !important;
   unicode-bidi: -moz-isolate;
}
 
:-moz-any(object,applet):-moz-any(:-moz-broken,:-moz-user-disabled) > *|* {
   /*
     Inherit in the object's alignment so that if we aren't aligned explicitly
     we'll end up in the right place vertically.  See bug 36997.  Note that this
     is not !important because we _might_ be aligned explicitly.
   */
   vertical-align: inherit;
}
 
img:-moz-suppressed, input:-moz-suppressed, object:-moz-suppressed,
embed:-moz-suppressed, applet:-moz-suppressed {
   /*
     Set visibility too in case the page changes display.  Note that we _may_
     want to just set visibility and not display, in general, if we find that
     display:none breaks too many layouts.  And if we decide we really do want
     people to be able to right-click blocked images, etc, we need to set
     neither one, and hack the painting code.... :(
   */
   display: none !important;
   visibility: hidden !important;
}
 
img[usemap], object[usemap] {
   color: blue;
}
 
frameset {
   display: block ! important;
   overflow: -moz-hidden-unscrollable;
   position: static ! important;
   float: none ! important;
   border: none ! important;
}
 
frame {
   border: none ! important;
}
 
iframe {
   border: 2px inset;
}
 
noframes {
   display: none;
}
 
spacer {
   position: static ! important;
   float: none ! important;
}
 
canvas {
   -moz-user-select: none;
}
 
/* focusable content: anything w/ tabindex >=0 is focusable, but we
   skip drawing a focus outline on a few things that handle it
   themselves. */
:-moz-focusring:not(input):not(button):not(select):not(textarea):not(iframe):not(frame):not(body):not(html) {
   /* Don't specify the outline-color, we should always use initial value. */
   outline: 1px dotted;
}
 
/* hidden elements */
base, basefont, datalist, head, meta, script, style, title,
noembed, param {
   display: none;
}
 
area {
   /* Don't give it frames other than its imageframe */
   display: none ! important;
}
 
iframe:-moz-full-screen {
   /* iframes in full-screen mode don't show a border. */
   border: none;
}
 
/* media elements */
video > xul|videocontrols, audio > xul|videocontrols {
   display: -moz-box;
   -moz-box-orient: vertical;
   -moz-binding: url("chrome://global/content/bindings/videocontrols.xml#videoControls");
}
 
video:not([controls]) > xul|videocontrols,
audio:not([controls]) > xul|videocontrols {
   visibility: hidden;
}
 
audio:not([controls]) {
   display: none;
}
 
/* emulation of non-standard HTML <marquee> tag */
marquee {
   width: -moz-available;
   display: inline-block;
   vertical-align: text-bottom;
   text-align: start;
   -moz-binding: url('chrome://xbl-marquee/content/xbl-marquee.xml#marquee-horizontal');
}
 
marquee[direction="up"], marquee[direction="down"] {
   -moz-binding: url('chrome://xbl-marquee/content/xbl-marquee.xml#marquee-vertical');
   height: 200px;
}
 
/* PRINT ONLY rules follow */
@media print {
 
   marquee { -moz-binding: none; }
 
}

Syntax Highlighting per Generic Syntax Highlighter: http://qbnz.com/highlighter

Buchempfehlungen