grafikerstellung

Habbo

Das Habbodesign auf Icebluebasis:

Habbodesign mit Coolmenü:

Codes:

Text über dem Design:

/* Hintergrund hinter Design */
body {
background-color:#343434;
background-image:url(http://i277.photobucket.com/albums/kk73/GymnastBoii/i285041766_53415_5.jpg);
background-repeat: repeat;
text-align:center; }

/* Schriftfarbe + Größe auf allen Seiten */
td {
color:#000000;
font-size:14px;
text-align:left;
font-family: arial,verdana; }

/* Linkfarben + Größen auf Seiten */
a:link {
color:#1E90FF;
font-size:14px;
font-family:arial,verdana;
text-decoration:none; }

/* besuchte Links */
a:visited {
color:#800000;
font-size:14px;
font-family:arial,verdana;
text-decoration:none;}

/*Hover-Effekt bei Links*/
a:hover{
color:#000080;
font-size:14px;
font-family:arial,verdana;
text-decoration:none;}

/* Header oben */
td.edit_header_full {
background-color:#FFFFFF;
background-image:url(https://img.webme.com/pic/m/mrquirinho-test/habboheader.jpg);
background-repeat:no-repeat;
border:1px solid #000000; }

/* Titel im Header entfernen */
td.headline {visibility:hidden;}

/* Titel über Navigation */
td.nav_heading {
color:#FFFFFF;
font-size:14px;
font-family:arial,verdana;
text-align:center;
height:29px;
background-color:#FF6A00;
background-image:url(https://img.webme.com/pic/m/mrquirinho-test/balken_schwarz.jpg);
border:1px solid #FF6A00; }

/* Navigation Buttons */
td.nav {
background-color:#FF6A00;
background-image: url(https://img.webme.com/pic/f/free-picture/radon66iceblue185x33_29.png);
border:1px solid #000000; }

/* Hover-Effekt Navigation Buttons */
td.nav:hover {
background-color:#FF6A00;
background-image:url(https://img.webme.com/pic/f/free-picture/radon66iceblue185x33_38.png);
border:1px solid #000000; }

/* Textlinks in Navigation */
td.nav a {
color:#000000;
font-size:14px;
font-family:arial,verdana;
text-decoration:none;
text-align:left; }

/* Hover-Effekt Textlinks */
td.nav a:hover{
color:#FFFFFF;
font-size:14px;
font-family:arial,verdana;
text-decoration:none;
text-align:left; }

/* Bild unter Navigation entfernt */
td.edit_below_nav {display:none;}

/* Feld hinter Navigation / Kein Scrollbalken mehr bei Seiten mit wenig Inhalt */
td.edit_main_tr {
height: 50% !important; }

/* Hintergrund Navigation */
td.edit_navi_headbg {
height: 50%;
background-color:#xxxxxx ;
background-image: none;
border:0px solid #FF6A00; }

/* Balken über Textfeld */
td.edit_content_top {
height:29px;
background-color:#FF6A00;
background-image:url(https://img.webme.com/pic/m/mrquirinho-test/balken_schwarz.jpg);
border:1px solid #FF6A00; }

/* Seitentitel über Textfeld */
td.headline2 {
color:#FFFFFF;
font-size:12px;
font-family:arial,verdana;
text-align:left; }

/* Textfeld */
td.edit_content {
padding-top:15px;
padding-bottom:15px;
background-color:#FFD800;
background-image:  none;
border:1px solid #FF6A00; }

/* Linke Spalte im Textfeld */
td.edit_content_left_spacer {
background-color:#FFD800;
background-image: none; }

/* Rechte Spalte im Textfeld */
td.edit_content_right_spacer {
background-color:#FFD800;
background-image: none; }

/* Erste Balken unter Textfeld */
td.edit_content_bottom {
height:29px;
background-color:#FF6A00;
background-image: url(https://img.webme.com/pic/m/mrquirinho-test/balken_schwarz.jpg);
border:1px solid #FF6A00; }

/* Zweiter Balken unter Textfeld (mit Counter) */
td.edit_content_bottom2 {
background-color:#XXXXXX ;
background-image:  none;
border:0px solid #000000; }

/* Counter / Besucherzähler */
td.edit_content_bottom2_counter {
font-family:arial,verdana;
font-size:12px;
background-color:#c9c9c9;
border:1px solid #000000; }

/* große Feld unter Textfeld */
td.edit_rechts_cbg {
background-color:#XXXXXX;
background-image:  none;
border:0px solid #FF6A00; }

/* Streifen rechts vom Design entfernt mit */
td.edit_rechts_sbg {display:none;}

/* Titel über rechter Box */
td.sidebar_heading {
color:#FFFFFF;
font-size:14px;
font-family:arial,verdana ;
text-align:center;
height:29px;
background-color:#FF6A00;
background-image: url(https://img.webme.com/pic/m/mrquirinho-test/balken_schwarz.jpg);
border:1px solid #FF6A00; }

/* rechte Boxen 1 bis 5 */
td.shouty, .shouty2, .shouty3, .shouty4, .shouty5 {
color:#000080;
font-size:14px;
font-family.arial,verdana;
text-align:left;
background-color:#FFD800;
background-image:  none;
border:1px solid #FF6A00; }

/* Abschluß unter Boxen 1 bis 5 entfernt mit */
td.edit_rb_footer{display:none; }

/* Hintergrund unter rechten Boxen */
td.edit_rechts_bottom {
background-color:#XXXXXX ;
background-image:  none;
border:0px solid #FF6A00; }

--> </style>

Text unter dem Design:

/* Abstand zwischen Schrift zum Rand */
li a {
padding-right: 30px;
padding-top: 10px; }

/* Coolmenü positionieren, Werte bei "top" , "left" und "width" anpassen */
div.menu {
position: absolute;
z-index: 3;
top: 190px;
left: 100px;
width:850px; }

/* Breite der Menüpunkte einstellen */
.menu li {
width: 160px;
float: left; }

/* Aussehen der Menüpunkte einstellen (Hintergrund, Schriftart und Größe) */
.menu a {
border: 0px solid #FF6A00;
background-color: #FF6A00;
background-image: url(URL);
font-family: Verdana, sans-serif;
font-size: 14px;
text-align: center;
text-decoration: none;
font-weight: bold;
cursor: pointer;
margin: 0px;
display: block;
height: 23px;
color: #FFD800; }

/* Aussehen der Menüpunkte beim Hover Effekt */
.menu a:hover {
background-color: #FFD800;
background-image: url(URL);
color: #FF6A00; }

#smenu1, #smenu2, #smenu3, #smenu4, #smenu5 {
font-size: 14px;
display: none;
width: 160px;
float: left; }

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a {
font-weight: bold;
padding-top: 5px;
border-top: 0px;
cursor: pointer;
color: #FFFFFF; }
//--> </style>   <script type="text/javascript">

</script>   <div class="menu"> <li><a href="javascript:void(0);" _fcksavedurl="javascript:void(0);" onmouseover_fckprotectedatt="%20onmouseover%3D%22montre('smenu1')%3B%22" onmouseout_fckprotectedatt="%20onmouseout%3D%22cache('smenu1')%3B%22">Hauptmenü 1</a> <ul id="smenu1" onmouseover_fckprotectedatt="%20onmouseover%3D%22montre('smenu1')%3B%22" onmouseout_fckprotectedatt="%20onmouseout%3D%22cache('smenu1')%3B%22"> <li><a href="Unterlink 1.1" _fcksavedurl="Unterlink 1.1">Untermenü 1.1</a></li> <li><a href="Unterlink 1.2" _fcksavedurl="Unterlink 1.2">Untermenü 1.2</a></li> <li><a href="Unterlink 1.3" _fcksavedurl="Unterlink 1.3">Untermenü 1.3</a></li> <li><a href="Unterlink 1.4" _fcksavedurl="Unterlink 1.4">Untermenü 1.4</a></li> <li><a href="Unterlink 1.5" _fcksavedurl="Unterlink 1.5">Untermenü 1.5</a></li> </ul> </li> <li><a href="javascript:void(0);" _fcksavedurl="javascript:void(0);" onmouseover_fckprotectedatt="%20onmouseover%3D%22montre('smenu2')%3B%22" onmouseout_fckprotectedatt="%20onmouseout%3D%22cache('smenu2')%3B%22">Hauptmenü 2</a> <ul id="smenu2" onmouseover_fckprotectedatt="%20onmouseover%3D%22montre('smenu2')%3B%22" onmouseout_fckprotectedatt="%20onmouseout%3D%22cache('smenu2')%3B%22"> <li><a href="Unterlink 2.1" _fcksavedurl="Unterlink 2.1">Untermenü 2.1</a></li> <li><a href="Unterlink 2.2" _fcksavedurl="Unterlink 2.2">Untermenü 2.2</a></li> </ul> </li> <li><a href="javascript:void(0);" _fcksavedurl="javascript:void(0);" onmouseover_fckprotectedatt="%20onmouseover%3D%22montre('smenu3')%3B%22" onmouseout_fckprotectedatt="%20onmouseout%3D%22cache('smenu3')%3B%22">Hauptmenü 3</a> <ul id="smenu3" onmouseover_fckprotectedatt="%20onmouseover%3D%22montre('smenu3')%3B%22" onmouseout_fckprotectedatt="%20onmouseout%3D%22cache('smenu3')%3B%22"> <li><a href="Unterlink 3.1" _fcksavedurl="Unterlink 3.1">Untermenü 3.1</a></li> <li><a href="Unterlink 3.2" _fcksavedurl="Unterlink 3.2">Untermenü 3.2</a></li> </ul> </li> <li><a href="javascript:void(0);" _fcksavedurl="javascript:void(0);" onmouseover_fckprotectedatt="%20onmouseover%3D%22montre('smenu4')%3B%22" onmouseout_fckprotectedatt="%20onmouseout%3D%22cache('smenu4')%3B%22">Hauptmenü 4</a> <ul id="smenu4" onmouseover_fckprotectedatt="%20onmouseover%3D%22montre('smenu4')%3B%22" onmouseout_fckprotectedatt="%20onmouseout%3D%22cache('smenu4')%3B%22"> <li><a href="Unterlink 4.1" _fcksavedurl="Unterlink 4.1">Untermenü 4.1</a></li> <li><a href="Unterlink 4.2" _fcksavedurl="Unterlink 4.2">Untermenü 4.2</a></li> </ul> </li> <li><a href="javascript:void(0);" _fcksavedurl="javascript:void(0);" onmouseover_fckprotectedatt="%20onmouseover%3D%22montre('smenu5')%3B%22" onmouseout_fckprotectedatt="%20onmouseout%3D%22cache('smenu5')%3B%22">Hauptmenü 5</a> <ul id="smenu5" onmouseover_fckprotectedatt="%20onmouseover%3D%22montre('smenu5')%3B%22" onmouseout_fckprotectedatt="%20onmouseout%3D%22cache('smenu5')%3B%22"> <li><a href="Unterlink 5.1" _fcksavedurl="Unterlink 5.1">Untermenü 5.1</a></li> <li><a href="Unterlink 5.2" _fcksavedurl="Unterlink 5.2">Untermenü 5.2</a></li> </ul> </li> </div>

Das Design kann farblich geändert werden und das Coolmenü kann auch geändert oder Entfernt werden.

mfg der Webmaster