Virág Design - G-Portál

AJÁNLOM AZ OLDALT

table 29 css

tábla ccs 29:

Demó:

menü

menü menü menü menü

menü

menü menü menü menü menü

menü

menü menü menü menü menü

menü

menü menü menü menü menü

JégVirág Design

Kód:

<div class="trackname1">menü

</div>

<div class="trackname2">menü

</div>

<div class="trackname3">menü

</div>

<div class="trackname4">menü

</div>

<div class="trackcharname">JégVirág Design</div>

</div>

.trackbox { margin:0 auto; position:relative; width:450px; height:475px; background-color:#FEFB8B; border:3px double #0a1f2c; background-repeat:no-repeat; }

.trackname1 { height:18px; width:105px; position:absolute; top:10px; left:2px; line-height:16px; font-weight:400; font-family:'Oswald', sans-serif; color:#053452; background-color:#FFFFFF; transition:height 0.5s ease-in-out; -moz-transition:height 0.5s ease-in-out; -webkit-transition:height 0.5s ease-in-out; -o-transition:height 0.5s ease-in-out; -ms-transition:height 0.5s ease-in-out; text-align:center; text-transform:uppercase; border:1px solid #000; padding-top:2px; }

.trackname1:hover, .trackname2:hover, .trackname3:hover, .trackname4:hover { width:105px; height:100px; }

.trackname2 { height:18px; width:105px; position:absolute; top:10px; left:115px; line-height:16px; font-weight:400; font-family:'Oswald', sans-serif; color:#053452; background-color:#FFFFFF; transition:height 0.5s ease-in-out; -moz-transition:height 0.5s ease-in-out; -webkit-transition:height 0.5s ease-in-out; -o-transition:height 0.5s ease-in-out; -ms-transition:height 0.5s ease-in-out; text-align:center; text-transform:uppercase; border:1px solid #000; padding-top:2px; }

.trackname3 { height:18px; width:105px; position:absolute; top:10px; left:227px; line-height:16px; font-weight:400; font-family:'Oswald', sans-serif; color:#053452; background-color:#FFFFFF; transition:height 0.5s ease-in-out; -moz-transition:height 0.5s ease-in-out; -webkit-transition:height 0.5s ease-in-out; -o-transition:height 0.5s ease-in-out; -ms-transition:height 0.5s ease-in-out; text-align:center; text-transform:uppercase; border:1px solid #000; padding-top:2px; }

.trackname4 { height:18px; width:105px; position:absolute; top:10px; right:3px; line-height:16px; font-weight:400; font-family:'Oswald', sans-serif; color:#053452; background-color:#FFFFFF; transition:height 0.5s ease-in-out; -moz-transition:height 0.5s ease-in-out; -webkit-transition:height 0.5s ease-in-out; -o-transition:height 0.5s ease-in-out; -ms-transition:height 0.5s ease-in-out; text-align:center; text-transform:uppercase; border:1px solid #000; padding-top:2px; }

.trackcharname { position:absolute; bottom:5px; right:0; text-align:center; width:450px; text-transform:lowercase; font-family:'Satisfy', cursive; font-size:42px; line-height:46px; font-weight:400; color:#B2C27B; text-shadow:1px 1px 0 #000, 1px 0px 0 #000, 1px 1px 0 #000, 1px 1px 0 #000; }

.trackname1 .threadlist { postion:absolute; top:10px; left:2px; width:105px; height:400px; opacity:0; -moz-opacity:0; filter:alpha(opacity=0); font-size:12px; font-family:arial; color:#134476; font-weight:bold; }

.trackname2 .threadlist { postion:absolute; top:10px; left:115px; width:105px; height:400px; opacity:0; -moz-opacity:0; filter:alpha(opacity=0); font-size:12px; font-family:arial; color:#134476; font-weight:bold; }

.trackname3 .threadlist { postion:absolute; top:10px; left:227px; width:105px; height:400px; opacity:0; -moz-opacity:0; filter:alpha(opacity=0); font-size:12px; font-family:arial; color:#134476; font-weight:bold; }

.trackname4 .threadlist { postion:absolute; top:10px; right:3px; width:105px; height:400px; opacity:0; -moz-opacity:0; filter:alpha(opacity=0); font-size:12px; font-family:arial; color:#134476; font-weight:bold; }

.trackname1:hover .threadlist, .trackname2:hover .threadlist, .trackname3:hover .threadlist, .trackname4:hover .threadlist { opacity:1; -moz-opacity:1; filter:alpha(opacity=100); }

.threadlist a { color:#134476; text-decoration:none; display:block; }

.threadlist a:hover { color:#029792; text-decoration:none; }

.camithreadcredit { margin:-3px auto; width:450px; text-transform:uppercase; font-family:calibri; font-size:10px; text-align:center; }

</style><center>

(Ha valami nem megy szólj és segítek. virag-78@gportal.hu )

Ellenorítve:2017.04.12.

Oldal információ

Portálépítés és portáldíszítés kezdőknek és haladóknak! Rengetek leírás, JavaScriptek , CSS ,HTML kódok,Naptár,Design! E-mail:virag-78@gportal.hu Tárhely: gportal.hu Kategoria:Portálépítés Indulás:2005.04.12. URL: jegvirag.gportal.hu Facebook: Virág Design Szerkeszto/Design:Virág