|
CSS - A Golden God Is Made!
The first ever fully integrated CSS expanding/collapsing menu is here, get them while they are hot!! Ok, ok, maybe that was a bit over the top but, hey what can one do? Heh! I have finally finished it, if the actual coding can be improved and such, please feel free to critique.
Code: <HTML><HEAD><BASE taget="menu"><STYLE TYPE="text/css"><!--
table {display: block; border-color: #B0C4DE; border-style: inset; border-width: 10px; position: absolute; top: 75px; left: 20px;}
a:link {}
a:visited {}
a:hover {}
a:active {}
a {display: block; font-family: arial; font-size: 12px; color: #FFFF00; text-align: center; cursor: pointer; text-decoration: none; border-color: #B0C4DE; border-style: outset; border-width: 4px; padding: 2px 15px 2px 15px;}
.main:hover {color: F5F5F5; background-color: #B0C4DE; border-style: inset; border-width: 1px;}
.show:hover a.sub1, .show:hover a.sub2, .show:hover a.sub3, .show:hover a.sub4, {display: block;}
a.sub1:hover, a.sub2:hover, a.sub3:hover, a.sub4:hover {color: #F5F5F5; background-color: #B0C4DE;}
a.sub1, a.sub2, a.sub3, a.sub4 {display: none;}
//--></STYLE></HEAD><BODY bgcolor="#778899"><TABLE><a href="#" return false;><tr><td>
<DIV CLASS="show"><DIV CLASS="main"><a href="#" return false;><B>Main 1</B></a></DIV>
<a CLASS="sub1" href="Doc1.html" target="docView">S1</a>
<a CLASS="sub1" href="" target="docView">S2</a>
<a CLASS="sub1" href="" target="docView">S3</a>
<a CLASS="sub1" href="" target="docView">S4</a>
<a CLASS="sub1" href="" target="docView">S5</a></DIV>
<DIV CLASS="show"><DIV CLASS="main"><a href="#" return false;><B>Main 2</B></a></DIV>
<a CLASS="sub2" href="" target="docView">S1</a>
<a CLASS="sub2" href="" target="docView">S2</a>
<a CLASS="sub2" href="" target="docView">S3</a>
<a CLASS="sub2" href="" target="docView">S4</a>
<a CLASS="sub2" href="" target="docView">S5</a></DIV>
<DIV CLASS="show"><DIV CLASS="main"><a href="#" return false;><B>Main 3</B></a></DIV>
<a CLASS="sub3" href=""urn false;>S1</a>
<a CLASS="sub3" href="" target="docView">S2</a>
<a CLASS="sub3" href="" target="docView">S3</a>
<a CLASS="sub3" href="" target="docView">S4</a>
<a CLASS="sub3" href="">S5</a></SPAN></SPAN></DIV>
<DIV CLASS="show"><DIV CLASS="main"><a href="#" return false;><B>Main 4</B></a></DIV>
<a CLASS="sub4" href="#" return false;>S1</a>
<a CLASS="sub4" href="" target="docView">S2</a>
<a CLASS="sub4" href="" target="docView">S3</a>
<a CLASS="sub4" href="" target="docView">S4</a>
<a CLASS="sub4" href="" target="docView">S5</a></DIV></td></tr></a></TABLE></BODY></HTML>
Similar TutorialsHello, I am trying to do a div box with a border made out of 4 blue pixels, and 2 black pixels. I tryied doing it at follows (which works), however I was wondering if there was a more simple solution... my current implementation for this required me of having to put two inner div's. I called one div outer, and the other one inner. The outer div has a border of 4 pixels solid blue, and the inner div has a border of 2 pixels solid black. the html code is as follows: Code:
<div class="mydiv">
<div class="outer">
<div class="inner">
Hello, World!
</div>
</div>
</div>
My question is whether there is any way to do this using one single div? regards, sim085 check this out, philistines LOL: Wiggles the Wonderworm not my design, but I think you'll agree how excellent it is. Is it possible to overlay a colour onto a grayscale image to make it that colour with css? Such as using the alpha channel? Image in question would be a transparent background gif file. |
|||||||