Loading AI tools
web tabanlı stil programlama dili Vikipedi'den, özgür ansiklopediden
Cascading Style Sheets (Basamaklı Stil Şablonları ya da Basamaklı Biçim Sayfaları, bilinen kısa adıyla CSS), HTML'e ek olarak metin ve format biçimlendirme alanında fazladan olanaklar sunan bir işaretleme dilidir.
İlk çıkışı | 17 Aralık 1996 |
---|---|
Geliştirici | Håkon Wium Lie, Bert Bos, World Wide Web Consortium |
Olağan dosya uzantıları | .css |
Web sitesi | w3.org/Style/CSS/ |
İnternet sayfaları için genelgeçer şablonlar hazırlama olanağı verdiği gibi, bağımsız olarak harflerin stilini, yani renk, yazı tipi, büyüklük gibi özelliklerini değiştirmek için de kullanılabilir. Bu tekniğin en önemli özelliği kullanımındaki esnekliktir.
Bir Web sayfası içerisinde birbiriyle uyumlu birkaç renk ve birkaç yazı tip kullanılır ve bunları her sayfada ayrı ayrı tekrar belirtmek yerine CSS yardımıyla bir sefer tanımlayıp bütün Web sayfalarında ortak olarak kullanılabilir. Böylece sayfaların hafızadaki boyutu epey küçüldüğü gibi güncelleme yapmak da kolaylaşır.
CSS kodları, HTML kodlarının içine yazılabildiği gibi harici bir CSS dosyası oluşturularak da işlem yaptırılabilir. Türüne göre <BODY>
veya <HEAD>
bölümlerinde yer alabilirler. Ayrıca <link rel="stylesheet" type="text/css" href="style.css" /> koduyla CSS dosyası çalışma sayfasına eklenebilir. Onları ayrı dosyada veya dosyalarda saklamak, onları değişik HTML sayfalarınca kullanılmasını sağlar, aynı sayfanın değişik aygıtlara göre formatlandırılmasını kolaylaştırır, sunumla yapıyı ayırarak değişiklik yapılmasını ekonomikleştirir.
<html>refreshed with css
<head>perfect customizations css
css maintenance custom
<style> w3.org/Style/CSS/
#WikipediaBox{
width:250px;
height:300px;
border:solid 2px;w3.org/Style
}
.WikipediaLogo{
background:url("http://upload.wikimedia.org/wikipedia/commons/e/e6/Wikipedia-logo-tr.png");
}
</style>
</head>
<body>
<div id="WikipediaBox">
<div class="WikipediaLogo"></div>
</div>
</body>
</html>
CSS kodlarının, HTML dosyasına eklenmesi temelde dört farklı şekilde yapılabilir.
<html>
<head>
<link rel="stylesheet" type="text/css" href="dosya.css">
</head>
<body>
<div>Eğer dosya.css sunucuda bulunuyorsa, HTML'in sunumunda kullanılacaktır.</div>
</body>
</html>
<html>
<head>
<style>
div {
color: red;
}
</style>
</head>
<body>
<div>Bu yazı kırmızıdır.</div>
</body>
</html>
<html>
<head>
<script>
var css = document.createElement("style");
css.type = "text/css";
css.innerHTML = "div { color: red; }";
document.body.appendChild(css);
</script>
</head>
<body>
<div>Bu yazı kırmızıdır.</div>
</body>
</html>
<html>
<body>
<div style="color: red;">Bu yazının rengi kırmızıdır.</div>
</body>
</html>
İnternet ile ilgili bu madde taslak seviyesindedir. Madde içeriğini genişleterek Vikipedi'ye katkı sağlayabilirsiniz. |
Seamless Wikipedia browsing. On steroids.
Every time you click a link to Wikipedia, Wiktionary or Wikiquote in your browser's search results, it will show the modern Wikiwand interface.
Wikiwand extension is a five stars, simple, with minimum permission required to keep your browsing private, safe and transparent.