HTML İle CSS Çalışması-2

Daha önceki dersimizde de bahsettiğimiz css ile site iskeleti yapımının ikinci örneğini içeriyor bugünkü yazımız bu örnek görsel olarak daha iyi ve şık bir görünüş sunuyor.HTML ile site yapmaya karar verdiyseniz css yapısını iyi öğrenmelisiniz.Çoğu şeyin temeli de css kodlarını içerdiği için şimdi size bazı temel şeyleri göstermek de bize düşer.
Merhaba arkadaşlar bu dersimizde yine güzel bir çalışma yapacağız. Css kodları ile araya hafif tasarımın girdiği bir çalışma olacak.Bunlar 4 adet Css tasarım kodları ile yapılmış basit tasarımlar.Renklendirmek tabi ki sizin elinizde :)

1.TASARIM

2.TASARIM

3.TASARIM

4.TASARIM

TÜM KODLAR

GÖRÜNÜM

Çalışmayı buradan indirebilirsiniz.

KODLAR


	<html> <head>
	<title>Css tasarım</title>
	<style type="text/css">
	.tasarim1
	{
	width:1250px;
	height:200px;
	background-color:red;
	font-size:65px;
	color:green;
	font-family:New Times Roman;
	font-weight:bold;
	}
	.tasarim2
	{
	width:1000px;
	height:150px;
	background-color:blue;
	font-size:50px;
	color:orange;
	font-family:Bradley Hand ITC;
	font-weight:bold;
	}
	.tasarim3
	{
	width:750px;
	height:120px;
	background-color:yellow;
	font-size:40px;
	font-family:Arial;
	color:red;
	font-weight:bold;
	}
	.tasarim4
	{
	width:650px;
	height:100px;
	background-color:orange;
	font-size:30px;
	font-family:Verdana;
	color:blue;
	font-weight:bold;
	}
	</style>
	</head>
	<body>
	<div class="tasarim1">Tasarım1</div>
	<div class="tasarim2">Tasarım2</div>
	<div class="tasarim3">Tasarım3</div>
	<div class="tasarim4">Tasarım4</div>
	</body>
	</html>

Yorumlar

Bu blogdaki popüler yayınlar

Algoritma İle 4 işlem Hesabı Yapan Program

Merhaba arkadaşlar yeni bir algoritma çalışması ile birlikteyiz.Bu günkü çalışmamız dört işlem üzerine olacak.Girilen iki sayı arasında toplama,çıkarma,çarpma ve bölme işlem sonuçlarını ekranda gösterecek.Mini bir hesap makinesi yapacağız ilerde şimdi sadece 4 işlemi konu alan bir çalışma yaptım. Kolay bir uygulama üstelik karışıkta olmadı Adımları aşağıda gösterdim.Umarım işinize yarar herkese kolay gelsin iyi dersler. ÇALIŞMADA İZLENECEK ADIMLAR Adım 1: Başla Adım 2: Birinci Sayıyı Gir:A Adım 3: İkinci Sayıyı Gir:B Adım 4: sonuç1=a+b A8 gideceğiz Adım 5 :sonuç2=a-b A9 gideceğiz Adım 6: sonuç3=a*b A10 gideceğiz Adım 7: sonuc4=a/b A11 gideceğiz Adım 8: Toplama işleminin sonucu:sonuç1 Adım 9: Çıkarma işleminin sonucu:sonuç2 Adım 10: Çarpma işleminin sonucu:sonuç3 Adım 11: Bölme işleminin sonucu:sonuç4 Adım 12: Bitir PROGRAMDA YAPIYORUZ; İşlemlerimiz bu kadar arkadaşlar.Göründüğü gibi zor bir tarafı yok.Mantık aynı mantık.Sadec...

Devamı

Algoritma İle Ehliyet Sorgulatma

Merhaba arkadaşlar bugün sizinle algoritma ile ehliyet alıp alınamayacağını sorgulayacağız.Basit bir uygulamayı daha önce C # ile yapmıştık şimdi Flow Chart ile yapacağız.Adımları ve kodları sizinle paylaşacağım umarım işinize yarar herkese kolay gelsin. İZLENECEK ADIMLAR: Adım 1: Başla Adım 2: Yaşınızı Giriniz:yas Adım 3: Eğer yas>=18 ise Adım 5 gideceğiz Adım 4: Eğer yas<= 18 ise Adım 6 gideceğiz Adım 5: Ehliyet alabilecek yaştasınız. Adım 6: Ehliyet alamayacak yaştasınız. Adım 7: Bitir PROGRAM İLE YAPALIM Çalışmanın mantığı basit.Eğer girilen yaş 18 ve 18 den büyükse ehliyet alabilecek.Aksi taktirde yaşı 18 den küçükse ehliyet alamayacak.Eğerleri çıkışlara bağladıktan sonra evet yazıları geliyor.Çalıştırdığınızda hata alırsınız.Program size hayır ile bağlamanız gerektiğini söylüyor.Bu nedenle bağlama işlemlerinde hata alıyoruz.Bunlara dikkat etmemiz yeterli.İşinize yaraması dileği ile herkese iyi günler,iyi dersler.

Devamı

JavaScript İle Kullanıcı Girişi

Kullanıcı Adı ve Şifreyi biz klavyeden girelim. BİRDE YANLIŞ YAPARAK DENEYELİM ÇALIŞMANIN KODLARI <html> <head> <title>Javascript Dersleri</title> <script language="javascript" type="text/javascript"> var ad=prompt("Adınızı Giriniz"); var sifre=prompt("Şifrenizi Giriniz"); if(ad=="mali" && sifre=="123") { document.write("Tebrikler Giriş Başarılı:", ad,sifre); } else { document.write("Kullanıcı adı veya şifre hatalı"); } </script> </head> </html>

Devamı

Programlama Dünyası

Bu Blogda Ara