160 likes | 354 Views
CSS. Евгения Ковачева. BODY. { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; SCROLLBAR-FACE-COLOR: #ffffff; FONT-SIZE: 11pt; BACKGROUND: #ffffff; PADDING-BOTTOM: 0px; MARGIN: 10px; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; SCROLLBAR-SHADOW-COLOR: #800080;
E N D
CSS Евгения Ковачева
BODY { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; SCROLLBAR-FACE-COLOR: #ffffff; FONT-SIZE: 11pt; BACKGROUND: #ffffff; PADDING-BOTTOM: 0px; MARGIN: 10px; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; SCROLLBAR-SHADOW-COLOR: #800080; COLOR: #cccccc; SCROLLBAR-3DLIGHT-COLOR: #ffffff; SCROLLBAR-ARROW-COLOR: #800080; PADDING-TOP: 0px; SCROLLBAR-TRACK-COLOR: #ffffff; FONT-FAMILY: "Verdana", sans-serif; SCROLLBAR-DARKSHADOW-COLOR: #ffffff }
TABLE { BORDER-RIGHT: gray 0px solid; BORDER-TOP: gray 0px solid; MARGIN: 0px; BORDER-LEFT: gray 0px solid; BORDER-BOTTOM: gray 0px solid; border-spacing: 0px; hight: 95% }
TD { BORDER-RIGHT: gray 0px solid; PADDING-RIGHT: 10px; BORDER-TOP: gray 0px solid; PADDING-LEFT: 10px; PADDING-BOTTOM: 0px; BORDER-LEFT: gray 0px solid; BORDER-BOTTOM: gray 0px solid; border-spacing: 0px }
IMG { BORDER-RIGHT: 0px; BORDER-TOP: 0px; MARGIN: 3px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px }
h1 { color: #800080; font-family : verdana, arial; font-size: 14px; } h2 { color: #333333; font-family :verdana, arial; font-size: 12px; } P { color: #006600; font-family : arial, verdana; font-size: 12px; text-align : left; } fonts
lists OL { color: #006600; font-family : arial, verdana; font-size: 12px; } UL { color: #006600; font-family : arial, verdana; font-size: 12px; }
links A:link { color: #800080; font-family: verdana, arial; font-size: 12px; text-decoration: none;} A:visited { color: #800080; font-family: verdana, arial; font-size: 12px; text-decoration: none;} A:active { color: #000000; font-family: verdana, arial; font-size: 12px; text-decoration: none;} A:hover { color: #006600; font-family: verdana, arial; font-size: 12px; text-decoration: none;}
<HTML> <HEAD> <TITLE>Listing 15-4</TITLE> <STYLE>SPAN {position:absolute}</STYLE> <SCRIPT LANGUAGE="JavaScript"> function moveSpans(){ Span1.style.top=15 Span2.style.posTop=Span2.style.posTop+1 Span3.style.left=10 Span4.style.top=window.event.y Span5.style.posLeft=window.event.x Span6.style.pixelTop=window.event.x Span6.style.posLeft=window.event.y } </SCRIPT> </HEAD> <BODY onmousemove="moveSpans()"> <SPAN ID="Span1" STYLE="top: 0; left: 0">First Span</SPAN> <SPAN ID="Span2" STYLE="top: 50; left: 50">Second Span</SPAN> <SPAN ID="Span3" STYLE="top: 100; left: 100">Third Span</SPAN> <SPAN ID="Span4" STYLE="top: 150; left: 150">Fourth Span</SPAN> <SPAN ID="Span5" STYLE="top: 200; left: 200">Fifth Span</SPAN> <SPAN ID="Span6" STYLE="top: 250; left: 250">Sixth Span</SPAN> </BODY> </HTML> Span 1
<HTML> <HEAD> <TITLE>Listing 15-1</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- function changeIt(oClicked){ oCS=oClicked.style alert("You clicked the element named "+oClicked.id+".") alert("It is "+oCS.fontWeight+". Click OK to change it.") if (oCS.fontWeight=='bold'){oCS.fontWeight='normal'} else {oCS.fontWeight='bold'} } //--> </SCRIPT> </HEAD> <BODY> <SPAN ID=MySpan STYLE="font-weight: bold; cursor: hand" onclick="changeIt(this)"> Click me! Then click me again! </SPAN> </BODY> </HTML> Span 2
<HTML> <HEAD> <TITLE>Listing 15-2</TITLE> <STYLE> SPAN {font-size: 18pt; cursor: hand} .on {display: on} A {text-decoration: none} A:hover {color: red; text-decoration: underline} </STYLE> <SCRIPT LANGUAGE="JavaScript"> <!-- // Set bSupportsDHTML to true for Internet Explorer 4 or later var bDoesDHTML = ( (navigator.userAgent.indexOf("MSIE") >= 0) && (navigator.appVersion.substring(0,1) >= 4) ) // Only hide menu items if browser supports DHTML if(bDoesDHTML){document.write("<STYLE>.off{display:none}</STYLE>")} function doSection(secNum){ if (bDoesDHTML){ //display the section if hidden; hide it if it is displayed if (secNum.className=="off"){secNum.className="on"} else{secNum.className="off"} } } //--> </SCRIPT> </HEAD> Дърво
дърво <BODY> <SPAN onclick="doSection(Sec1)"><B>Section 1</B></SPAN><BR> <DIV CLASS="off" ID="Sec1"> <A HREF="generic.htm">Chapter 1</A><BR> </DIV> <SPAN onclick="doSection(Sec2)"><B>Section 2</B></SPAN><BR> <DIV CLASS="off" ID="Sec2"> <A HREF="generic.htm">Chapter 2</A><BR> <A HREF="generic.htm">Chapter 3</A><BR> <A HREF="generic.htm">Chapter 4</A><BR> <A HREF="generic.htm">Chapter 5</A><BR> </DIV> <SPAN onclick="doSection(Sec3)"><B>Section 3</B></SPAN><BR> <DIV CLASS="off" ID="Sec3"> <A HREF="generic.htm">Chapter 6</A><BR> <A HREF="generic.htm">Chapter 7</A><BR> <A HREF="generic.htm">Chapter 8</A><BR> <A HREF="generic.htm">Chapter 9</A><BR> <A HREF="generic.htm">Chapter 10</A><BR> </DIV> </BODY> </HTML>
<HTML> <HEAD> <TITLE>No-Style Demonstration</TITLE> </HEAD> <BODY BGCOLOR="#000000" LEFTMARGIN=0 TOPMARGIN=0> <FONT COLOR="yellow" SIZE="6" FACE="verdana"> <B><I> Absolute Positioning </I></B> </FONT> <BR> </HTML> <FONT COLOR="white" SIZE="6" FACE="verdana"> <B><I> Welcome to Dynamic Styles </I></B> </FONT> <BR> <FONT COLOR="red" SIZE="5" FACE="verdana"> <B><I> Letter Spacing </I></B> </FONT> </BODY> Разстояние – редове – без стил
<HTML> <HEAD> <TITLE>Style Demonstration</TITLE> </HEAD> <BODY BGCOLOR="#000000" LEFTMARGIN=0 TOPMARGIN=0> <DIV STYLE=" position:absolute; top:30; left:60; color:yellow; font: bold italic 24pt Verdana;"> Absolute Positioning </DIV> <DIV STYLE=" position:absolute; top:50; left:80; color:white; font: bold italic 25pt Verdana; filter:glow(color=#996666, strength=6)"> Welcome to Dynamic Styles </DIV> <DIV STYLE=" position:absolute; top:100; left:90; color:red; font: bold italic 20pt Verdana; letter-spacing: 14pt"> Letter Spacing </DIV> </BODY> </HTML> Разстояние – редове – със стил