Sayfa içine (inline css) CSS yazımı

Sayfa içine doğrudan css yazılması da sık kullanılan yöntemlerden biridir. özellikle sadece bir sayfaya özel ve kısa olan css kodlarının yazılmasında tercih edilir.

en büyük dezavantajı ise yazılan css kodlarının sadece yazıldığı sayfa içinde kullanılmasıdır ki diğer sayfalarda kullanılamaz.

örnek kullanım.
(kullanılan css özelliklerinin ne anlama geldiği yanlarında açıklanmıştır.)

[code language=”html”]
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>sayfa içinde sayfaya özel css yazma</title>
<style type="text/css">
/*
burada css tanımlamaları yapılır.
*/
#header{
width:1000px; /*genişlik*/
height:120px; /*yükseklik*/
margin-right:auto; /*sağdan boşluk otomatik*/
margin-left:auto; /*soldan boşluk otomatik*/
background-color:#ff5c26; /*arkaplan rengi */
}

#content{
width:1000px;
height: 420px;
margin-right:auto;
margin-left:auto;
background-color:#ececfb;
}

#article{
float:left; /* divleri yan yana getirmek için */
width:700px;
height: 220px;
background-color:#ffbf00;
}

#aside{
float:right;
width:290px;
height: 320px;
background-color:#ffbf00;
}

#footer{
width:1000px;
height: 120px;
margin-right:auto;
margin-left:auto;
background-color:#4cd2ff;
}
</style>
</head>
<body>
<div id="header">header(üst</div>
<!–
header isimli id atamasına örnek
–>
<div id="content">
<div id="article">content left(içerik sol)</div>
<div id="aside">content right(içerik sağ)</div>
</div>
<div id="footer">footer(alt)</div>
</body>
</html>
[/code]

Facebooktwitterlinkedin