10 Kasım 2016 Perşembe

Grafik Hafta8 Photosop

PHOTOSOP

<html>
<head><title>Grafik Ve Animasyon/8</title></head>
<body bgcolor="#ffeb11">
<font size="5" color="#6c3b5e"
face="Berlin Sans FB">
Grafik Ve Animasyon/8</font>
<br>
<img src="photosop/resim1.jpg"
width="100 px" height="100 px"
title="Pembe-Gri-Yeşil-Beyaz-Sarı-Turuncu-Siyah-Mavi-mor-Kırmızı renkler
border="5 px">
<img src="photosop/resim2.jpg"
width="100 px" height="100 px"
title="Mavi-Mor-Pembe-Yeşil-Sarı-Turuncu renkler
border="5 px">
<img src="photosop/resim3.jpg"
width="100 px" height="100 px"
title="Beyaz-Mavi renkler
border="5 px">
<br> Kodları sayfamıza yaptığımız resimleri eklememizi sağlar.(Örnek)


8 Kasım 2016 Salı

Web Hafta8 CSS5

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=utf-8" />
<title>CSS</title>
<style type="text/css">
h1
{
color:#F36;
background-color:#FF0;
}
#baslik
{
color:#603;
}
.baslik
{
color:#F96;
}
</style>
</head>
<body>
<h1>Merhaba</h1>
<h1 id="baslik">Dünyalılar</h1>
<h1 class="baslik">Nasılsınız?</h1>
</body>
</html> Böylece bütün etiketleri bir arada kullanabiliyoruz.(Örnek)

Web Hafta8 CSS4

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=utf-8" />
<title>CSS</title>
<style type="text/css">
#paragraf1
{
color:#0F0;
font-size:24px;
text-decoration:underline;
}
#paragraf2
{
color:#0F0;
font-size: 36px
text-decoration:underline;
}
</style>
</head>
<body>
<p id="paragraf1">CSS ÖĞRENMEYE BAŞLAYALIM!</p>
<p id="paragraf2">CSS ÖĞRENMEYE BAŞLAYALIM!</p>
<p>CSS öğrenmeyi seviyorum</p>
</body>
</html>  ID seçiciler  yalnız bir ögeye atanır.(Örnek)




Web Hafta8 CSS3

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=utf-8" />
<title>SCC</title>
<style type="text/css">
.onemli{
color: #936;
font-weight:bold;
}
</style>
</head>
<body>
<p class="onemli">Okulumuzdan İl Birinciliği</p>
<h1 class="onemli">Okulumuzdan İl Birinciliği</h1>
</body>
</html> Örneğin seçtiğimiz isim “baslik” olsun ve tabii ki bunun bir sınıf seçicisi olduğunu belirtmek için başında nokta işareti olacak Şekilde “.baslik” yazmalıyız.(Örnek)


Web Hafta8 CSS2

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=utf-8" />
<title>CSS</title>
<style type="text/css">
#paragraf1
{
color:#0F0;
font-size:24px;
text-decoration:underline;
}t
</style>
</head>
<body>
<p id="paragraf1">CSS ÖĞRENMEYE BAŞLAYALIM!</p>
<p>CSS öğrenmeyi seviyorum</p>
</body>
</html> ID seçiciler  yalnız bir ögeye atanır ve bir kez kullanılırlar.(Örnek)


Web hafta8 CSS1

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=utf-8" />
<title>CSS</title>
<style type="text/css">
body
{
background-color: #0F0;
}
h1{font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
font-size:36px;
font-weight:inherit;
color: #009;
}
</style>
</head>
<body>
<h1>CSS ÖĞRENMEYE BAŞLAYALIM!</h1>
<h1>css öğrenmeyi seviyorum</h1>
</body>
</html> Bu kodlarını dreamweaver CS6 da  istediğimiz stili uygulamak için kullanılır.(Örnek)


4 Kasım 2016 Cuma

Web Hafta7 Frameset Rows

FRAMESET ROWS

<htm>
<head>
<title>Frameset Rows Örneği</title>
</head>
<frameset rows="30%,40%,30%">
<frame name="satir1"src="s1.html">
<frame name="satir2"src="s2.html">
<frame name="satir3"src="s3.html">
</frameset>
</html>  Kodları çerçeveleri kullanmamızı sağlar.(Örnek)
 frame:Çerçevelemek

Web Hafta7 İndex

İNDEX

<html>
<head><title>Melis Mutlu</title></head>
<body>
<table bgcolor="#faf79b"border="0px"width=800px">
<tr><td><img src="resim1.jpg"</td></tr>
<tr><td>
<table>
<tr>
<td>
<table width="205px">

<tr background="resim1.jpg"
height="75px"><td><font color="#8d0e57"> ANA SAYFA</font></td></tr>
<tr background="resim1.jpg"
height="75px"><td><font color="#8d0e57"> HAKKIMIZDA</font></td></tr>
<tr background="resim1.jpg"
height="75px"><td><font color="#8d0e57"> İLETİŞİM</font></td></tr>
<tr background="resim1.jpg"
height="75px"><td><font color="#8d0e57"> ÜRÜNLER</font></td></tr>
<tr height="75px"><td></td></tr>
</table>
</td>
<td valign="top">
<table width="595px">
<tr>
<td width="110px" valign="top"><h3>Ana Sayfa</h3><br><img src="resim5.jpg"</td>
<td><font color="#8d0e57">Birinci vazifen, Türk istiklâlini, Türk Cumhuriyetini, ilelebet, muhafaza ve müdafaa etmektir.<br>

Mevcudiyetinin ve istikbalinin yegâne temeli budur. Bu temel, senin, en kıymetli hazinendir. İstikbalde dahi, seni bu hazineden mahrum etmek isteyecek, dahilî ve haricî bedhahların olacaktır. Bir gün, İstiklâl ve Cumhuriyeti müdafaa mecburiyetine düşersen, vazifeye atılmak için, içinde bulunacağın vaziyetin imkân ve şerâitini düşünmeyeceksin! Bu imkân ve şerâit, çok nâmüsait bir mahiyette tezahür edebilir. İstiklâl ve Cumhuriyetine kastedecek düşmanlar, bütün dünyada emsali görülmemiş bir galibiyetin mümessili olabilirler. Cebren ve hile ile aziz vatanın, bütün kaleleri zaptedilmiş, bütün tersanelerine girilmiş, bütün orduları dağıtılmış ve memleketin her köşesi bilfiil işgal edilmiş olabilir. Bütün bu şerâitten daha elîm ve daha vahim olmak üzere, memleketin dahilinde, iktidara sahip olanlar gaflet ve dalâlet ve hattâ hıyanet içinde bulunabilirler. Hattâ bu iktidar sahipleri şahsî menfaatlerini, müstevlilerin siyasi emelleriyle tevhit edebilirler. Millet, fakr ü zaruret içinde harap ve bîtap düşmüş olabilir.<br>

Ey Türk istikbalinin evlâdı! İşte, bu ahval ve şerâit içinde dahi, vazifen; Türk İstiklâl ve Cumhuriyetini kurtarmaktır! Muhtaç olduğun kudret, damarlarındaki asil kanda mevcuttur!<br>

 

Mustafa Kemal Atatürk
20 Ekim 1927
</font>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td></tr>
<tr bgcolor="#ff7e76"height="50px"<h3>Ana Sayfa</h3><td></td></tr>
</table>
</body>
</html> Kodları aşağıdaki örneği yapmamızı sağlıyor.(Örnek)


Web Hafta7 İframe

İFRAME

<html>
<body bgcolor="maroon">
<iframe name="ornek"src="s1.html"width="200"height="100"scrolling="yes">
</iframe>
<iframe name="ornek"src="s2.html"width="200"height="100"scrolling="yes">
</iframe>
<iframe name="ornek"src="s3.html"width="200"height="100"scrolling="yes">
</iframe>
<html>
<body bgcolor="maroon">
<iframe name="ornek"src="file:///C:/Users/mls/Desktop/134/index.html"width="200"height="100"scrolling="yes">
</iframe>
</body>
</html>
</body>
</html> Kodları sayfamızda istediğimiz boyutta bir kutu içinde yazı yazabilmemizi sağlıyor.(Örnek)

frame:Çerçevelemek

maroon:Kestane rengi
scrolling:Kaydırma



1 Kasım 2016 Salı

Web Hafta7 İndex

İNDEX

<html>
<head>
<title>Frameset Cols Örneği</title>
</head>
<frameset cols="30%,40%,30%">
<frame name="sutun1"src="s1.html">
<frame name="sutun2"src="s2.html">
<frame name="sutun3"src="s3.html">
</frameset>
</html> Kodları çerçeveleri kullanmamızı sağlar.(Örnek)
frameset:Pencereleri bölmeye yarıyor.

  Bunu siteyi yapmak için ilk önce
 Sayfa1'i
 Sonra Sayfa2'yi
 Son olarak Sayfa3'ü  Adım adım yapmamız gerekir.

Web Hafta7 Ödev

ÖDEV

<html>
<head>
<title>Tablolar</title></head>
<body>
<center><h1><font color="#000000">HAFTA7|ÖDEV</font></h1><center>
 <table  border="1" width="400px" bgcolor="#5beaef"  border="0">
<tr>
<td align=right><font color="#000000"><center>ADI SOYADI:<center></font></td>
<td ><font color="#000000"><input type="text"Name="adisoyadi"></font></td>
</tr>
<tr>
<td 
<form>
<center>SINIFI:<center>
<select name="sınıfı">
<option>9.Sınıf </option>
<option>10.Sınıf</option>
<option>11.Sınıf</option>
<option>12.Sınıf</option>
</selct>
</form>
</font></td>
<tr>
<td align=right><font color="#000000"><center>NUMARASI:<center></font></td>
<td><font color="#000000"><input type="text"name="numarasi"></font></td>
</tr>
<tr>
<td 
<form>
<center>YABANCI DİL:<center>
<select name="diller">
<option>İngilizce </option>
<option>İspanyolca</option>
<option>Almanca</option>
</selct>
</form>
</tr>
</font></td>
<td>
<form>
<h3><center>Hobilerimiz<center></h3>
<input type="checkbox"name="onay1"checked="on">Kitap<br>
<input type="checkbox"name="onay2">Müzik <br>
<input type="checkbox"name="onay3"checked="on">Bahçe<br>
<input type="checkbox"name="onay3">İnternet<br>
</form></tr>

</font></td>
<tr>
<td>
<form>
<center>DÜŞÜNCELERİNİZ:<center>
<textarea name="düşünceleriniz"rows="5"cols="30">
</textarea>
</form>
</tr>
</font></td>
<tr>
<td>
<form>
<input type="reset"value="Gönder"
</form></tr>

</font></td>
</table>
</body>
</html> Kodları form oluşturmamızı sağlar.(Örnek)
<input />: Form için bilgi alanı
<option>:Etiketi seçim listesinde bir seçenek tanımlar.
Checkbox: kullanıcıya seçenekler sunarak bunlardan birini, birkaçını ya da tamamını seçebilmesi istenen 
Checked:Checkboxun seçili olup olmadığının belirtileceği yerdir. 
<textarea>: Form için uzun yazı alanı
width:Genişlik