Laste ned template

Rinox · 27. juli 2006

Hei! Nå skulle jeg teste dette med å laste ned gratis templates (for kanskje å lære noe nytt ut av kodene som er brukt) , men jeg finner ikke ut hvordan jeg skal vise css koden når jeg har klikket på download? Kan noen prøve og se om de får det til? Jeg bare prøvde med denne: http://blogger-templates.blogspot.com/2006...ell-street.html

Takk for svar

iChristian · 27. juli 2006

CSS koden ligger vanligvis i en annen fil, altså style.css eller lignende, du finner plasseringen til den vanligvis mellom <head></head> i toppen av htmlfilen

Her så var det en kombinasjon.

Noe var lagt inn som vist ovenfor, mens noe var mellom <style></style>

Skjult tekst: (Marker innholdet i feltet for å se teksten):

<style type="text/css">
body {
   background: #aaa;
   font-family: Arial, verdana, sans-serif;
font-size: 12px;
   color: #000;
 margin: 0;
padding: 0;
   }
   
#b-navbar {
   height:0px;
   visibility:hidden;
   display:none
   }
   
#container {
width: 830px;
margin: 0 auto;
   border:1px solid #333;
   background: #525252;
   }
   
#headr {
   font-family: "Trebuchet MS", Helvetica, sans-serif;
   background: #333;
   color: #ddd;
   padding: 50px 0 60px 55px;
   font-size: 50px;
   margin: 0;
   }
   
#headr a {
   color: #ddd;
   text-decoration: none;
   }
   
#ad {
   background:#ddd url(http://photos1.blogger.com/blogger/5442/340/320/BT_ad.gif) repeat-y;
   border-top:1px solid #777;
   padding: 10px 0 10px 100px;
   margin: 0;
   }
   
   
#left {
   width:190px; 
   float:left; 
   background: #525252;
   color: #fff;
   padding: 0;
   margin: -8px 0 0;
   }
   
#left a {
   color: #fff;
   text-decoration: none;
   }
   
#left a:visited {
   color: #ccc;
   }
   
#left a:visited {
   text-decoration: none;
   }
   
.title {
   font-family: "Trebuchet MS", Helvetica, sans-serif;
   font-weight: bold;
   font-size: 20px;
   color:#EEAD10;
   padding-bottom: 5px;
   }
   
.blok {
   border-top: 1px solid #777;
   padding:6px 5px 20px 10px;
   }
   
#right {
   border-top:1px solid #333;
   }
   
.content {
   margin-left: 190px;
   background: #fff;
   padding: 3px;
   }
   
h1 {
   font-family: "Trebuchet MS", Helvetica, sans-serif;
   color: #333;
   font-size: 20px;
   padding-left: 10px;
   }

.post {
   padding: 10px 20px 20px 20px;
   }
   
.box {
   text-align: center;
   margin: 10px;
   float: left;
   width: 250px;
   }
   
.thumb {
   width:200px;
   height:146px;
   margin-top:5px;
   padding:5px;
   border:1px solid #777;
   }
   
#right a {
   color: #000;
   }
   
.stripe {
   background: #f6f6f6;
   border-top: 1px solid #aaa;
   border-bottom: 1px solid #aaa;
   text-align: center;
   padding: 5px 0;
   margin: 0 0 15px 0;
   }
   
.center {
   text-align: center
   }
   
img {
   border: 1px solid #555;
   }

#foot {
   clear:both;
   text-align: center;
   padding: 10px 0;
   font-size: 10px;
   border-top: 1px solid #333;
   background: #ddd;
   }
#foot a {
   color: #000;
   text-decoration: none;
   }
   

/*------------- LightBox CSS -----------------------------------------------------*/


#lightbox{
position: absolute;
top: 40px;
left: 0;
width: 100%;
z-index: 100;
text-align: center;
padding: 0 0 30px;
line-height: 0;
}

#lightbox a img{ border: none; }

#outerImageContainer{
position: relative;
background-color: #fff;
width: 250px;
height: 250px;
margin: 0 auto;
}

#imageContainer{
padding: 10px;
}

#loading{
position: absolute;
top: 40%;
left: 0%;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
}
#hoverNav{
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
width: 49%;
height: 100%;
background: transparent url(http://maximum.googlepages.com/blank.gif) no-repeat; /* Trick IE into showing hover */
display: block;
}
#prevLink { left: 0; float: left; }
#nextLink { right: 0; float: right; }
#prevLink:hover, #prevLink:visited:hover { background: url(http://maximum.googlepages.com/prev.png) 20% 53% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(http://maximum.googlepages.com/next.png) 80% 53% no-repeat; }


#imageDataContainer{
font: 10px Verdana, Helvetica, sans-serif;
background-color: #fff;
margin: 0 auto;
line-height: 1.4em;
}

#imageData{
padding:0 10px;
}
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}  	
#imageData #bottomNavClose{ width: 36px; float: right;  padding-bottom: 0.7em;	}	
 
#overlay{
position: absolute;
top: 0;
left: 0;
z-index: 90;
width: 100%;
height: 500px;
background-color: #000;
filter:alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
}
.clearfix:after {
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

* html>body .clearfix {
display: inline-block; 
width: 100%;
}

* html .clearfix {
/* Hides from IE-mac \*/
height: 1%;
/* End hide from IE-mac */
}



.box {
   float: none;
   width:560px;
   text-align: left;
   }

       </style>

Endret 27. juli 2006 av Lomz

Jesper Karsrud · 27. juli 2006

http://googlelite.free.fr/powell-street.css

Rinox · 27. juli 2006

Jibril2k... Hvordan fikk du tak i CSS koden?

Rinox · 27. juli 2006

Takk dere Fant det ut nå

Logg inn

Laste ned template

Anbefalte innlegg

Rinox

Lenke til kommentar

Videoannonse

iChristian

Lenke til kommentar

Jesper Karsrud

Lenke til kommentar

Rinox

Lenke til kommentar

Rinox

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer