XML CSS

XML dökümanlarını CSS ile zenginleştirebilirsiniz. Harici CSS dosyasını çağırmak için;

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="stil.css"?>

stil.css dosyasını çağırmak için önce xml başlangıç etiketini ekliyoruz. Sonrasında href="stil.css" kısmına css dosyamızı çağırıyoruz.

Şimdi kutuphane.xml diye bir dosya oluşturuyoruz ve bunu stil.css ile içeriğini biçimlendiriyoruz.

Önce kutuphane.xml oluşturalım ve CSS dosyasının yolunu ekleyelim.

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="stil.css"?>
<kitaplar>
	<kitap isbn="9759954949">
		<adi>Yunus Emre Divanı</adi>
		<yazar gorev="Derleyici">Selim Yağmur</yazar>
		<dil>Türkçe</dil>
		<baski>8</baski>
		<tarih>
			<yil>2014</yil>
			<ay>04</ay>
			<gun>01</gun>
		</tarih>
	</kitap>
	<kitap isbn="9753386203">
		<adi>Risaletü'n-Nushiyye Yunus Emre</adi>
		<yazar gorev="Çevirmen">Prof. Dr. Umay Türkeş Günay</yazar>
		<dil>Türkçe</dil>
		<baski>3</baski>
		<tarih>
			<yil>2009</yil>
			<ay>01</ay>
			<gun>01</gun>
		</tarih>
	</kitap>
</kitaplar>

Şimdi stil.css hazırlayalım.

kitaplar {
  padding: 10px;
}

kitap {
  display: block;
}

kitap adi {
  color: blue;
  font-size: 20px;
  display: block;
}

kitap yazar,
dil,
baski,
tarih {
  display: block;
  margin-left: 10px;
}

Hazırladığımız css uyguladığımızda aşağıdaki gibi bir ekran görüntüsü verir.

Eğer CSS ile biçimlendirmeseydik sonuç aşağıdaki gibi olurdu.