0
Kayıt Ol

CSS Sıkıştırma

1

●

776

  • 27-10-2008, 16:14:49
    #1
    ßaron
    ßaron
    Css dosyalarını yazarken gereksiz yere çok boşluk bırakırız, buda hitler arttıkça yavaşlığa ve sunucu kasmaya kadar yol açar.
    Bu css leri sıkıştırarak hem boyutu küçültmüş oluruz hemde azda olsa performansa faydası olur.
    Programsız online aşağıdaki adresten css dosyalarınızı sıkıştırabilirsiniz.
    CSS Drive Gallery- CSS Compressor
    Örnek:
    Bendeki css dosyanın bir kısmı:
    * {
	margin: 0;
	padding: 0;
}
body {
	background: #FFFFFF url(images/img01.gif) repeat-x;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #333333;
}
form {
}
input, textarea {
	padding: 2px 5px;
	font: normal 1em "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #333333;
}
h1, h2, h3 {
	margin-top: 1.5em;
	font-weight: normal;
}
h1 {
	font-size: 2em;
}
h2 {
	font-size: 1.4em;
}
h3 {
	font-size: 1em;
}
p, ul, ol {
	margin-top: 1.5em;
	line-height: 160%;
}
ul, ol {
	margin-left: 3em;
}
blockquote {
	margin-left: 3em;
	margin-right: 3em;
}
a {
	color: #CC6B47;
}
a:hover {
	text-decoration: none;
	color: #3760BF;
}
a img {
	border: none;
}
img.left {
	float: left;
	margin: 0 20px 0 0;
}
img.right {
	float: right;
	margin: 0 0 0 20px;
}
hr {
	display: none;
}
#header {
	width: 778px;
	height: 110px;
	margin: 0 auto;
}
#header h1, #header h2 {
	margin: 0;
	letter-spacing: -0.05em;
	text-transform: lowercase;
	font-weight: normal;
}
#header h1 {
	float: left;
	padding-top: 40px;
	font-size: 4em;
}
#header h1 a {
	text-decoration: none;
}
#header h2 {
	float: left;
	padding: 67px 0 0 8px;
	font-size: 2em;
	font-style: italic;
	color: #858585;
}
    Sıkıştırılmış hali:
    *{margin:0;padding:0}body{background:#FFF url(images/img01.gif) repeat-x;font-family:"Trebuchet MS",Arial,Helvetica,sans-serif;font-size:13px;color:#333}form{}input,textarea{padding:2px 5px;font:normal 1em "Trebuchet MS",Arial,Helvetica,sans-serif;color:#333}h1,h2,h3{margin-top:1.5em;font-weight:normal}h1{font-size:2em}h2{font-size:1.4em}h3{font-size:1em}p,ul,ol{margin-top:1.5em;line-height:160%}ul,ol{margin-left:3em}blockquote{margin-left:3em;margin-right:3em}a{color:#CC6B47}a:hover{text-decoration:none;color:#3760BF}a img{border:none}img.left{float:left;margin:0 20px 0 0}img.right{float:right;margin:0 0 0 20px}hr{display:none}#header{width:778px;height:110px;margin:0 auto}#header h1,#header h2{margin:0;letter-spacing:-0.05em;text-transform:lowercase;font-weight:normal}#header h1{float:left;padding-top:40px;font-size:4em}#header h1 a{text-decoration:none}#header h2{float:left;padding:67px 0 0 8px;font-size:2em;font-style:italic;color:#858585}
    her ihtimale karşı css dosyanızın ayrı bir yedeğini alın.