|
|
|
|
| |
The basic structure Iceblue |
|
| |
Make your own design CSS Iceblue! The basic structure / free Design!
Iceblue free design process:
This code could be as a "basic framework".
|
<style type="text/css">
<!--
/* Design tools */
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%
table.edit_rechts_tabelle{width: 100% !important;}
td.edit_rechts_bottom{width: 15% !important;}
td.edit_rechts_cbg{width:100%;}
/*Link and text formatting */
p, div, b{color: #000000;}
td.nav a{color:#XXXXXX;
font-size: 12px;
text-decoration: none;}
a:hover {color: #XXXXXX;
font-size: 12px;
text-decoration: none;}
a: link {color: #XXXXXX;
font-size: 12px;
text-decoration: none;}
a:active {color: #XXXXXX;
font-size: 12px;
text-decoration: none;}
a:visited {color: #XXXXXX;
font-size: 12px;
text-decoration: none;}
/*Background ,behind design */
body{
background-image: url();
background-color: #XXXXXX;
color: #000000 !important;}
(----or background with image
body{
background-image: url(http://Here background image);
color: #000000 !important;}-----)
/* Header fixed and centered */
td.edit_header_full{
width: 100% !important;
background-repeat:no-repeat;
background-position:center center;
background-image: url(http://Here header image);}
/* Remove Track header */
td.headline{visibility:hidden;}
/* Navigation*/
td.nav{
text-decoration: none;
color: #000000;
width: 185px;
height: 40px;
background-image: url(http://Here Button 1.jpg);}
td.nav:hover{
color: #000000;
width: 185px;
height: 40px;
background-image: url(http://Here Button 2.jpg);}
td.edit_navi_headbg{
margin: 0px;
padding: 0px;
background-image: url();
background-color: #XXXXXX;
width: 185px;
background-repeat: repeat-y;}
td.edit_below_nav{
visibility: hidden;
width: 185px;}
td.edit_below_nav img{
visibility: hidden;
width: 1px;}
td.nav_heading{
width: 89px;
height: 80px;
background-image: url(http://Image(bild) of Navigation.jpg);
background-color: #XXXXXX;
padding-top: 0px;
font-weight: bold;
font-size: 15px;
text-decoration: none;}
td.edit_navi_headbg table{
width: 185px;}
.menu{
width: 185px;
color: #000000 !important;
font-weight: bold;
padding-left: 35px;
font-size: 12px;}
.menu a{
color: #000000;
font-weight: bold;
padding-left: 35px;
text-decoration: none;
font-size: 12px;}
/* Text box link formatting */
td.edit_content a{
color:#XXXXXX;
font-size: 12px;
text-decoration: none;}
td.edit_content a:hover {
color: #XXXXXX;
font-size: 12px;
text-decoration: none;}
/* Text box background */
td.edit_content {
background-image:url();
background-color: #XXXXXX;}
/* Titles about page remove */
td.headline2{visibility:hidden;}
td.idcp{visibility:hidden;}
td.edit_content_top{
height: 25px;
background-image: url();
background-color: #XXXXXX;}
td.edit_content_bottom{
background-image: url();
background-color: #XXXXXX;}
td.edit_content_bottom2{
background-image: url();
background-color: #XXXXXX;
text-align: right;}
td.edit_rechts_cbg{
margin: 0px;
background-image: url(URL);
background-color: #XXXXXX;}
/* Rights boxes */
td.edit_rechts_sbg{
background-image: url();
width: 0px;}
td.sidebar_heading{
background-image: url();
background-color: #XXXXXX;
border-bottom: 0px double #XXXXXX;}
.shouty, .shouty2, .shouty3, .shouty4, .shouty5{
background-image: url();
background-color: #XXXXXX;
color: #000000;
font-weight: bold;}
td.edit_rb_footer{
background-image: url();
background-color: #XXXXXX;
border-bottom: 0px solid #XXXXXX;}
td.edit_rechts_bottom{
background-image: url();
background-color: #XXXXXX;}
-->
</style> !important;} |
Explanation:
Orange = colors text or colors link
Green = colors design / background colors
Red = The "classes"
-----------------------------------------------------------------------------------------------------------
One element invisible:
| |
Here td. class (visibility: hidden;)
Here td. class (background-image: url ();background-color: transparent;) |
-----------------------------------------------------------------------------------------------------------
Exchange background image:
Here td. class ( background-image: url (http://here your image URL);
background-color: # XXXXXX;)
Exchange background image with identification of heights:
Here td. class (background-image: url (http://hier your image URL);
background-color: # XXXXXX;height: XXpx;)
-----------------------------------------------------------------------------------------------------------
Exchange background color:
Here td. class (background-image: url ();background-color: # XXXXXX;)
-------------------------------------------------------------------------
Here you'll find the "classes" in the design :
Add to Homepage: Edit design --> Extended Setting --> Text at top of page !
by Gruss Wolle
|
|
|
|
|
|
|
|
|
|
|
|
|