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 sayfalarındaki metin, görsel, bağlantı gibi öğelerin biçimlerini ve yerleşimlerini düzenlemeye yarayan 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ının sayfa yapısı için genel geçer şablonlar hazırlama olanağı verdiği gibi, sayfada yer alan öğelerin stilini, yani renk, yazı tipi, büyüklük gibi özelliklerini değiştirmek için de kullanılabilir. CSS'in en önemli özelliği kullanımındaki esnekliktir.
Bir web sitesinde genellikle birbiriyle uyumlu birkaç renk ve birkaç yazı tipi seçilerek tüm sitede bunlar kullanılır. Bu tercihleri her sayfada ayrı ayrı belirtmek yerine CSS yardımıyla bir sefer tanımlayıp bütün sayfalarda ortak olarak kullanılabilir. Böylece sayfaların hafızadaki boyutu küçülür. Sayfayı görüntülemek için indirilen veri miktarı azaltır ve önbellek kullanımı mümkün olur. Sayfaların güncellenmesi kolaylaşır.
CSS stilleri, HTML kodlarının içine yazılabildiği gibi, harici bir CSS dosyası oluşturularak da kullanılabilir. Stiller, HTML sayfalarının <BODY> veya <HEAD> bölümlerinde yer alabilir, etiketlerin içine (satır içi CSS) yazılabilir ya da <LINK> etiketi kullanılarak harici CSS dosyalarından eklenebilir.
#WikipediaBox {
width: 250px;
height: 300px;
border: 2px solid;
}
.WikipediaLogo {
background: url("http://upload.wikimedia.org/wikipedia/commons/e/e6/Wikipedia-logo-tr.png");
}
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.
