Kutu ile bilgi gösterimi CSS

Forum Sayfası

Dosyayı görmek için tıklayınız. 

<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta charset="utf-8">
	<style type="text/css">
		.kutu{float: left;
			width: 300px;
			height: 350px;
			background-color: pink;
			border-style: solid; 
			margin: 5px;}

		.sol_ustte{
			position: absolute;
			left: 20px;
			top:20px;
		}
		.resimveyazi{
			position: relative;
			float: left;
		}
		.yazim{
			
			background-color: white;
			margin:5px;
			
	

		}
		.resim{float: left; padding: : 3px; margin: 10px;}
	</style>
</head>
<body>

<div class="kutu"> 
	<div class="resimveyazi">
	<img class="resim" src="150x85.jpg">
	<div class="sol_ustte">Topkapı Sarayı</div>
	<p class="yazim">Topkapı Sarayı, Osmanlı sultanlarının ikametgâhı, devletin yönetim ve eğitim merkezidir. İstanbul fatihi Sultan II. Mehmed tarafından 1460-1478 tarihleri arasında yaptırılmış olan ve zaman içerisinde bazı ilavelerin yapıldığı Saray’da, Osmanlı padişahları ve Saray halkı 19. yüzyıl ortalarına kadar ikamet etmiştir. 1850’lerin başında Sultanlar, mevcut Saray 19. yüzyılın devlet protokolü ve merasimlerine ilişkin gereksinimleri karşılamakta yetersiz kaldığı için Boğaz’daki Dolmabahçe Sarayı’na taşınmışlardır.</p>

	</div>
</div>

<div class="kutu">
	<div class="resimveyazi">	
		<img class="resim" src="150x85.jpg">
		<div class="sol_ustte">Ayasofya</div>
		<p class="yazim">
			Dünya mimarlık tarihinin günümüze kadar ayakta kalmış en önemli anıtları arasında yer alan Ayasofya; mimarisi, ihtişamı, büyüklüğü ve işlevselliği yönünden sanat dünyası açısından önemli bir yer teşkil etmektedir.

Ayasofya Doğu Roma İmparatorluğu’nun İstanbul’da yapmış olduğu en büyük kilise olup aynı yerde üç kez inşa edilmiştir. İlk yapıldığında Megale Ekklesia (Büyük Kilise) olarak adlandırılmış, 5. yüzyıldan itibaren ise Ayasofya (Kutsal Bilgelik) olarak tanımlanmıştır. Ayasofya Doğu Roma İmparatorluğu boyunca hükümdarların taç giydiği, başkentin en büyük kilisesi olarak katedral işlevi görmüştür.

		</p>
 	</div>
 </div>

<div class="kutu"> 
	<div class="resimveyazi">
		<img class="resim" src="150x85.jpg">
		<div class="sol_ustte">Sultanahmet Camii</div>
	<p class="yazim"> İç duvarlarını süsleyen göz alıcı desenlerin renginden dolayı yurt dışında “Blue Mosque” (Mavi Cami) adıyla anılan Sultanahmet Camii, Türk-İslam mimarisinin en başarılı örneklerinden birisi olarak gösteriliyor. İnşasında tercih edilen mimari anlayışla Osmanlı cami kültürüne yepyeni bir bakış açısı getiren yapı, Tarihi Yarımada turu kapsamında görülmesi gereken duraklardan bir tanesi. İşte tüm yönleriyle bir semte adını veren Sultanahmet…
	</p>
	</div>		
</div>
</body>
</html>

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir