28 Ağustos 2013 Çarşamba

20.08.2013: Bugün birgün önce araştırmasını yaptığım kodların bir kısmıyla ilgili örnekler yaptım...

örnek1:float


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>FLOAT</title>
<style type="text/css">
img{width:500px;height:400px;float:right;}
</style>
</head>
<body>
<p>Bu özellik ile birlikte bir html dosyasindaki resmi ilk konumundan baska bir konuma getirebiliriz.
bunu bir resim üzerinde denemek istiyorum.simdi yapicam çoooook güzel olacak hemde çoook güzel....<img src="ksm.jpg"/> böylece sizde güzel bisekilde görüp anlamis olursunuz.
kullandim simdi nasil olmus?????begendiniz mi????
</p>
</body>
</html>

örnek2:CSS




<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>MELEK KIRKPINAR </title>
<style>
.rsm img{float:right;}
  .rsm img {width:200px;height:250px;}
h1{color:darkblue;font-size:30px;}
p{color:red;font-size:50px;}
</style>
</head>
<body>
<div class="rsm">
<img src="askale.jpg"/>
</div>
<h1>ÖDEVIMI TAMAMLAMALIYIM....</h1>
<p>bu benim en güzel ödevimmm...</p>
</body>
</html>
örnek3:height
 



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Height ödevim/</title>
<style type="text/css">
.mlk img{height:125px;}
</style>
</head>
<body>
<h1>önce</h1><br>
<img src="cicek.jpg" />
<div class="mlk">
<h2>sonra</h2>
<img src="cicek.jpg" />
</div>
</body>
</html>


örnek4:width
 



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Width ödevim/</title>
<style type="text/css">
.mlk img{width:625px;}
</style>
</head>
<body>
<h1>ÖNCE</h1><br>
<img src="ela.jpg" />
<div class="mlk">
<h2>VEE SONRAAA</h2>
<img src="ela.jpg" />
</div>
</body>
</html>

örnek:5margin

 



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>margin ödevim</title>
<style>
h1{color:#6600FF ;font-size:25px;margin:50px;}
p{color:#CC0033;font-size:35px;}
</style>
</head>
<body>
<p> melek </p>
<h1> Adimin soyadima uzakligi...</h1>
</body>
</html>


ödev6:css cağirma


  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>css çagirma ödevim</title>
<link rel=stylesheet type=text/css href=melek.css>
</head>
<body>
<div class="css">
<h1>Melek ödevi tamamla</h1>
<b> Tamamladiktan sora CSS i çagirmayi unutma....</b>
</body>
</html>


VE bugünlük çalışmamıda tamamlamış bulunuyorum......


Hiç yorum yok:

Yorum Gönder