[Cascading Style Sheets]
[Vorherige Seite] [Naechste Seite] [Inhalt dieses Abschnitts] [Home Page]
Beispiel für ein Style Sheet

Unten sehen Sie den kompletten Inhalt der Dateien stylesheets.css und n_stylesheets.css (für Netscape), die für diesen Abschnitt verwendet werden. Ich habe sie als Besipiele eingebaut, die Sie studieren und mit denen Sie experimentieren können, wenn Sie Ihre eigenen Style Sheets entwickeln.

Version für Internet Explorer 4.0 


	.blue
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 12pt;
		color: #990000;
		background: #CCFFFF;
		position: relative;
		}

	.dropshadow
	{
		font: Bold x-large 'Arial', 'sans-serif';
		position:relative;
		top:0;
		left:0;
		width:auto;
		height:100;
		filter:dropshadow(color=#483D8B,OffX=3,OffY=3,Positive=1)}

	.dropshadow1
	{		
		font: Bold x-large 'Arial', 'sans-serif';
		color: #FFFFCC;
		filter: DropShadow(Color=#669999,OffX=-3,OffY=-3,Positive=0);
		width: auto;
		height: auto;
		position: relative;
		}

	.first
	{		
		border-top-width: thin;
		border-left-width: thin;
		border-left-color: #66CC99;
		border-top-color: #66CC99;
		border-top-style: outset;
		border-left-style: inset;
		padding-top: 2pt;
		padding-left: 2pt;
		}

	.float
	{		
		width: 40%;
		text-align: left;
		float: right;
		font-size: 10pt;
		color: #006600;
		background: #FFFFFF;
		position: relative;
		padding: 4pt 4pt;
		border-width: thin;
		border-style: groove;
		}

	.glow
	{		
		font: Bold x-large 'Arial', 'sans-serif';
		color: #CC6699;
		filter: glow(Color=#FFFF00,Strength=5);
		width: auto;
		height: auto;
		position: relative;
		left: 0;
		top: 0;
		}

	.hugeding
	{		
		font: 80pt 'Wingdings', 'fantasy';
		color: #FFFF99;
		position: relative;
		}

	.indent
	{		
		margin-left: 1cm;
		position: relative;
		}

	.large
	{		
		font-family: 'Arial', 'Sans-Serif';
		font-style: italic;
		font-weight: bold;
		font-size: 16pt;
		color: #660066;
		text-align: left;
		position: relative;
		}

	.noindent
	{
		margin-left: 0;
		position: relative;
		}

	.note
	{		
		font-size: 10pt;
		color: #006600;
		background: #FFFFFF;
		position: relative;
		padding: 2pt 2pt;
		border-width: thin;
		border-style: groove;
		}

	.red
	{		
		font-family: 'Arial', 'Sans-Serif';
		font-weight: normal;
		font-size: 8pt;
		color: #FF0000;
		text-align: center;
		position: relative;
		}

	.redleft
	{		
		font-family: 'Arial', 'Sans-Serif';
		font-size: 9pt;
		color: #990000;
		text-align: left;
		position: relative;
		}

	.shadow
	{		
		font: Bold x-large 'Verdana', 'Arial', 'Sans-Serif';
		color: #9999ff;
		filter: shadow(Color=#330066,Direction=135);
		height: 45;
		position: relative;
		left: 0;
		top: 0;
		}

	.shadow3
	{		
		font: Bold x-large 'sans-serif';
		color: #339999;
		position: absolute;
		left: 18pt;
		top: 35pt;
		z-index: 3;
		}

	.small
	{		
		font-family: 'Arial', 'Sans-Serif';
		font-weight: normal;
		font-size: 8pt;
		text-align: center;
		}

	A:active
	{		
		color: #FF0000;
		}

	B
	{		
		color: #990000;
		position: relative;
		}

	BLOCKQUOTE
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 11pt;
		color: #000066;
		position: relative;
		margin-left: 2cm;
		}

	CAPTION
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 10pt;
		color: #000066;
		margin: .1in;
		position: relative;
		}

	DIV
	{		
		position: relative;
		}

	H1
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: xx-large;
		color: #996699;
		text-align: Left;
		position: relative;
		filter: shadow(color=#660099,OffX=6,OffY=6,Positive=1) ;
		}

	H2
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 18pt;
		color: #660066;
		text-align: Center;
		position: relative;
		}

	H3
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 16pt;
		color: #ffff66;
		background: #996699;
		padding: 5pt. 5pt;
		position: relative;
		}

	H4
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 11pt;
		color: #660066;
		background: transparent;
		width: auto;
		height: auto;
		position: relative;
		left: auto;
		top: auto;
		}

	H5
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 10pt;
		color: #660066;
		background: #FFFFCC;
		padding: 5pt;
		position: relative;
		}

	I
	{		
		color: #000099;
		position: relative;
		}

	LI
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 11pt;
		color: #000066;
		margin: .4cm;
		position: relative;
		}

	OL
	{		
		position: relative;
		margin-left: 1.5cm;
		}

	P
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 11pt;
		color: #000066;
		position: relative;
		margin-left: 1cm;
		}

	PRE
	{		
		font-family: 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 10pt;
		color: #990000;
		text-align: left;
		margin-left: 1cm;
		position: relative;
		}

	TABLE
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 11pt;
		color: #006600;
		position: relative;
		}

	TD
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 11pt;
		color: #000066;
		position: relative;
		}

	TH
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 12pt;
		color: #990000;
		background: #CCCC99;
		position: relative;
		}

	TR
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 11pt;
		color: #000066;
		position: relative;
		}

	UL
	{		
		position: relative;
		margin-left: 1.5cm;
		}
Version für Internet Explorer 3.0 


	.StyleSheetHiddenPlaceHolder { display: none; }

	H1
	{		
		font-family: "'Trebuchet MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 30pt;
		color: #660066;
		}

	H2
	{		
		font-family: "'Trebuchet MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: x-large;
		color: #660066;
		}

	H3
	{		
		font-family: "'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 12pt;
		color: #660066;
		background: #FFFFCC;
		}

	H4
	{		
		font-family: "'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 11pt;
		color: #660066;
		background: #FFFFCC;
		}

	H5
	{		
		font-family: "'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 10pt;
		color: #660066;
		background: #FFFFCC;
		}

	P
	{		
		font-family: "'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 11pt;
		color: #000066;
		margin-left: 1cm;
		}

	BLOCKQUOTE
	{		
		font-family: " 'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 11pt;
		color: #000066;
		margin-left: 2cm;
		}

	PRE
	{		
		font-family: 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 12pt;
		color: #990000;
		}

	XMP
	{		
		font-family: "'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 10pt;
		color: #990000;
		text-align: left;
		}

	I
	{		
		color: #000099;
		}

	B
	{		
		color: #990000;
		}

	UL
	{		
		margin-left: 1.5cm;
		}

	OL
	{		
		margin-left: 1.5cm;
		}

	LI
	{		
		font-family: "'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 11pt;
		color: #000066;
		}

	TD
	{		
		font-family: "'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 11pt;
		color: #000066;
		}

	TH
	{		
		font-family: "'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 12pt;
		color: #990000;
		background: #CCCC99;
		}

	TH.blue
	{		
		font-family: "'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 12pt;
		color: #990000;
		background: #CCFFFF;
		}

	CAPTION
	{		
		font-family: "'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 10pt;
		color: #000066;
		margin: .1in;
		}

	A:active
	{		
		color: #FF0000;
		}

	.note
	{		
		font-size: 10pt;
		color: #006600;
		background: #FFFFFF;
		}
	.small
	{		
		font-family: "'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 8pt;
		text-align: center;
		}

	.red
	{		
		font-family: "'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 8pt;
		color: #FF0000;
		text-align: center;
		}

	.redleft
	{		
		font-family: "'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 9pt;
		color: #990000;
		text-align: left;
		}

	.indent
	{ margin-left: 1cm }

	.noindent
	{
		margin-left: 0;
		position: relative;
		}

	.large
	{		
		font-family: "'Arial', 'Sans-Serif'";
		font-style: italic;
		font-weight: bold;
		font-size: 16pt;
		color: #660066;
		text-align: left;
		margin-left: 1cm;
		}

	.shadow
	{		
		font-family: " 'Trebuchet MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 30pt;
		color: #9999FF;
		text-align: left;
		
		}

	P.hugeding
	{		
		font: 80pt 'Wingdings', 'fantasy';
		color: #FFFF99;
		}

	.shadow3
	{		
		font-family: " 'Trebuchet MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 30pt;
		color: #336666;
		text-align: left;
		margin-top: -70pt;
		margin-left: 38pt;
		}
Version für Netscape Communicator 4.0 




	#layer1
	{		
		position: relative;
		}

	#layer2
	{		
		position: absolute;
		left: -1pt;
		top: -1pt;
		}

	.note
	{		
		font-size: 10pt;
		color: #006600;
		background: #FFFFFF;
		}

	.shadow
	{		
		font-family: 'Arial', 'Sans-Serif';
		font-style: bold;
		font-weight: bold;
		font-size: 30pt;
		color: #00CCCC;
		text-align: left;
		}

	A:active
	{		
		color: #FF0000;
		}

	A:link
	{		
		color: #0000FF;
		}

	A:visited
	{		
		color: #990099;
		}

	CAPTION
	{		
		font-family: 'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 10pt;
		color: #000066;
		margin: .1in;
		}

	EM
	{		
		color: #000099;
		}

	H1
	{		
		font-family: 'Arial', 'Sans-Serif';
		font-style: bold;
		font-weight: bold;
		font-size: 30pt;
		color: #666666;
		text-align: left;
		}

	H2
	{		
		font-family: 'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 14pt;
		color: #660066;
		}

	H3
	{		
		font-family: 'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 12pt;
		color: #660066;
		}

	H4
	{		
		font-family: 'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 11pt;
		color: #660066;
		}

	H5
	{		
		font-family: 'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 10pt;
		color: #660066;
		}

	LI
	{		
		font-family: 'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: medium;
		color: #000066;
		}

	OL
	{		
		font: 100% 'Trebuchet MS', 'Arial', 'sans-serif';
		}

	P
	{		
		font-family: 'Trebuchet MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 11pt;
		color: #000066;
		}

	.indent
	{		
		margin: 1cm;
		}

	.large
	{		
		font-family: 'Arial', 'Times New Roman';
		font-style: bold;
		font-weight: bold;
		font-size: 18pt;
		color: #999999;
		text-align: left;
		margin: .4cm .02cm;
		}

	.largeshadow
	{		
		font-family: 'Arial', 'Times New Roman';
		font-style: bold;
		font-weight: bold;
		font-size: 18pt;
		color: #000066;
		text-align: left;
		}

	.red
	{		
		font-family: 'Verdana', 'Arial', 'Sans-Serif';
		font-weight: normal;
		font-size: 6pt;
		color: #FF0000;
		text-align: center;
		}

	.redleft
	{		
		font-family: 'Verdana', 'Arial', 'Sans-Serif';
		font-weight: normal;
		font-size: 10pt;
		color: #990000;
		text-align: left;
		}

	.small
	{		
		font-family: 'Verdana', 'Arial', 'Sans-Serif';
		font-weight: normal;
		font-size: 8pt;
		text-align: center;
		}

	STRONG
	{		
		color: #990000;
		}

	TABLE
	{		
		font-family: 'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 11pt;
		color: #006600;
		}

	TD
	{		
		font-family: 'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 11pt;
		color: #000066;
		}

	TH
	{		
		font-family: 'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 12pt;
		color: #990000;
		background: #CCCC99;
		}

	TH.blue
	{		
		font-family: 'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 12pt;
		color: #990000;
		background: #CCFFFF;
		}

	TR
	{		
		font-family: 'Trebuchet MS', 'Comic Sans MS', 'Arial', 'Sans-Serif';
		font-weight: bold;
		font-size: 11pt;
		color: #000066;
		}

	UL
	{		
		font: 100% 'Trebuchet MS', 'Arial', 'sans-serif';
		}

	XMP
	{		
		font-family: 'Arial', 'Sans-Serif';
		font-weight: normal;
		font-size: 10pt;
		color: #990000;
		text-align: left;
		}
[Vorherige Seite] [Naechste Seite] [Inhalt dieses Abschnitts] [Home Page]

Bernhard Friedrich

doozer@hsguide.com