tutorials
  Quick-Iceblue-Codes
 
Code Wirkung

<style type="text/css">

<!--

td.edit_below_nav img{visibility: hidden;}

td.edit_below_nav{background-image: url(BILD-LINK);

background-repeat:no-repeat;background-position: center center;}

-->

</style>

 
Bild unter der Navigation

 

<style type="text/css">

<!--

td.edit_content{background-image:url(BILD-LINK);

background-repeat:no-repeat;background-position:center center;}

-->

</style>

 
Textfeld in der Mitte mit Bild-Hintergrund - 

zentriert und ohne Wiederholung


 

<style type="text/css">

<!--

td{color:#ffffff;}

-->

</style>

 
ändert die Schriftfarbe: bei Text über dem Design eingegeben - überall - bei text vor dem Gästebuch - dann nur im Gästebuch

 

<style type="text/css">

<!--

td.headline{visibility: hidden;}

-->

</style>

Seitentitel entfernen: So bleiben die Titel auch in der Browser-Leiste erhalten und das ist besser für Suchmaschinen, weil der Titel drin bleibt. Ein  aussagekräftiger Seitentitel sollte  für die Suchmaschinen gewählt werden - Im Header auf der Homepage bleibt Titel ist unsichtbar.

 
tr.checked_menu td{background-image:url(BUTTONLINK);}
tr.checked_menu td:hover{background-image:url(BUTTONLINKHOVER);}
zeigt uns durch einen andersfarbigen Button in der Navigation an, auf welcher Seite wir uns gerade befinden (aktive Seite).

 

<style type="text/css">

<!--

td.nav_heading{background-image: url(BILD-LINK);}

td.edit_content_top{background-image: url(BILD-LINK);}

td.sidebar_heading{background-image:url (BILD-LINK);}

-->

</style>

 

Wir benötigen 3 Balken(Bilder) für über der Navigation - über dem Mittelteil - für über den Boxen:

 

content top      568x33 Pixel

sidebar heading 170x33 Pixel

navheading       185x33 Pixel

 

 

<style type="text/css">

<!-- body{background-image:url(BILD-LINK);}

td.edit_below_nav{visibility:hidden;}

td.edit_content_bottom{background-image: none;}

td.edit_content_bottom2{background-image: none;}

td.edit_rechts_sbg{visibility:hidden;}

td.edit_rechts_cbg{background-image: none;}

td.edit_rb_footer{background-image: none;}

td.edit_rechts_bottom{background-image: none;}

Td.edit_navi_headbg{background-image: none;} 

-->

</style>

Hintergrundbild frei sichtbar- die Teile, die das Bild im original Design verdecken, sind weg mit diesem Code.

 
<style type="text/css">
<!--
a:link{color: #000000;text-decoration: none;}
a:visited{color: #585858;text-decoration: none;}
a:active{color: #000000;text-decoration: none;}
a:hover{color: #000000;text-decoration: underline;}
-->
</style>
Schriftveränderung in der Navigation: 

link - Schrift der Links

visited - Schrift der besuchten Links

active - Schrift der Seite, auf der wir uns gerade befinden

hover - Schrift beim überfahren der Navigation mit der Maus

#000000 -  Farb - Hex -Code 

text-decoration: underline - Text unterstrichen / none (nicht unterstrichen)


 

<style type="text/css">
<!--

td.shouty{color:#FFFFFFF;background-image: url(URL);background-color: #000000;}

td.shouty2{color:#FFFFFFF;background-image: url(URL);background-color: #000000;}

td.shouty3{color:#FFFFFFF;background-image: url(URL);background-color: #000000;}

td.shouty4{color:#FFFFFFF;background-image: url(URL);background-color: #000000;}

td.shouty5{color:#FFFFFFF;background-image: url(URL);background-color: #000000;}

-->

</style>

Schriftfarbe und Hintergrundfarbe in den 5 Boxen - die rot gekennzeichneten Farb-Hex-Codes kann man verändern.

 

<style type="text/css">
<!--

td.shouty{color:#FFFFFFF;background-image: url(URL);background-color: #000000;border: 1px solid #c5c6c5;}

td.shouty2{color:#FFFFFFF;background-image: url(URL);background-color: #000000;border: 1px solid #c5c6c5;}

td.shouty3{color:#FFFFFFF;background-image: url(URL);background-color: #000000;border: 1px solid #c5c6c5;}

td.shouty4{color:#FFFFFFF;background-image: url(URL);background-color: #000000;border: 1px solid #c5c6c5;}

td.shouty5{color:#FFFFFFF;background-image: url(URL);background-color: #000000;border: 1px solid #c5c6c5;}

-->

</style>

Schriftfarbe und Hintergrundfarbe mit Rand in den 5 Boxen - die rot gekennzeichneten Farb-Hex-Codes kann man verändern.

 

<style type="text/css">
<!--

td.nav{text-decoration: none;color: #FFFFFF;background-image: url(BUTTON-LINK);}

td.nav:hover{color: #FF0000;background-image: url(BUTTON-LINK);}

-->

</style>

Navigation-Button mit Hover-Button darunter - wird sichtbar beim überfahren mit der Maus - dazu  Textfarbe -Farb-Hex-Codes kann man verändern.

 
<style type="text/css">
<!--
a.ABC{position:absolute; left:60px; top:97px; font-family: Art grafitti; font-size: 16px; color:#FFFFFFF}
-->
</style>

<a class="ABC" href="LINK-URL">Text</a>
Header verlinken mit CSS  

rot = CSS-Klasse, die Bezeichnung muss gleich sein

türkis = Link - Adresse

grün = Positionierung (left - Abstand nach links, top - Abstand nach oben)

blau = Schrift-Art

gelb =  Schriftgröße

hellgrün = Schriftfarbe


 
<style type="text/css">
<!--
td.edit_content{background-image: none;border: 1px solid #c5c6c5;}
-->
</style>
Textfeld in der Mitte - Content  mit Rand 

Rot   Randbreite
Grün =
Farb-Hex-Code kann man verändern.


 
<style type="text/css">
<!--
table.edit_main_table{width: 100% !important;}
td.edit_main_tr{width: 100% !important;}
table.edit_second_table{width: 100% !important;}
td.edit_header_full{width: 100% !important;}
td.edit_header_full table{width: 100% !important;}
table.edit_third_table{width: 100% !important;}
td.edit_navi_headbg{width: 15% !important;}
table.edit_rechts_tabelle{width: 100% !important;}
td.edit_rechts_bottom{width: 15% !important;position: absolute;left: -300px;}
td.edit_rechts_cbg{width:100%;}
td.shouty{visibility: hidden;width: 0px;}
td.edit_rechts_sbg{visibility:hidden;}
td.sidebar_heading{visibility: hidden;}
td.edit_rb_footer{background-image: none;}
td.edit_rechts_bottom{background-image: none;}
-->
</style>
Design verbreitert und rechts alles weg - Boxen, etc.

Allerdings müssen dann auch die Bilder des Mittelteils angepasst werden - mit den original  Bildern geht das nicht.

 
 
Aktualisieren # Diese Seite Drucken ein Bild Zurück Vor ein Bild ein Bild ein Bild nur IE

Impressum | Rechtliche Hinweise | News

© success4you , Tutorials-Area 2007

 
 
http://www.bambusratte.com/taf.php?%20bgcolor=c5c5c5&txtcolor=000000&anrede=s&site=http:tutorials-%20area.de.tl&bgpic=http:img.webme.com/pic/t/tutorials-area/tutback2.gif&nametaf=Tell-A-Friend
Diese Webseite wurde kostenlos mit Homepage-Baukasten.de erstellt. Willst du auch eine eigene Webseite?
Gratis anmelden