Html ders 1
Türkçü Turancı Otağ, Kurt ini
 
*
Esenlikler, Ziyaretçi.Lütfen giriş yapın veya kayıt olun. 04 Nisan 2020, 05:02:38


Kullanıcı adınızı, parolanızı ve aktif kalma süresini giriniz
Otağ Kuruluş Tarihi: 10 Ekim 2008


Random Image
Sayfa: [1] 2
  Yazdır  
Gönderen Konu: Html ders 1  (Okunma Sayısı 2085 defa)
0 Üye ve 1 Ziyaretçi konuyu incelemekte.
TURK TIMUR ALP
Normal Üye
*
ileti Sayısı: 133



« : 27 Ekim 2010, 23:32:33 »

Esenlikler kandaslarim

Tamam kandaslar, biz internet sitelerinde geziniyoruz sayfalari dolasiyoruz, bunlari biliyoruz, peki bu sayfalarin içinde ne var nasil yapilmis bu sayfalar ?

Sayfalarin dizayni resim, yazilar logolar mutlaka bir dil ile yazilmistir, bizim timin Firefox tarayicisi bu dili arka planda çevirerek
sayfayi bize ekranda gösteriyor, kodlardan henüz anlamiyoruz, acemiyiz bu konuda.

Dil olarak HTML kullaniyorlar, Hyper text markup language, kelime anlami: hiper metin işaret dili.

Yahu nasil yapiyorlar bu isi ? Göz Kırp Ilgiyle okumaya devam edelim kandaslar
acemi sekilde konuya yaklasacagiz.

Cekinmeden adres çubuguna Köprülerin (Linklerin) Görülmesine İzin Verilmiyor.
Köprüleri (Linkleri) Görebilmek İçin Üye Olun veya Giriş Yapın
http://www.google.com.tr/
yazalim . Arka planda su söz konusu HTML kodlarina bi bakalim....
CTRL+U yapalim , 15 saniye çikan pencereyi inceleyelim.......
Aman tanrim bu ne ? Bir sürü karakter su bu diye sorarsiniz kendinize. Iste kandaslarim bu HTML kodlari, scriptlere suna buna deginmeyecegim, sadece bilgi amaçli anlatiyorum. Her site bu sekil kodlarla yazilmistir, bizler sadece kodlarin tarayici tarafindan
çeviri yapilmasi sonucunda sayfalari görebiliyoruz.

Bir sonraki dersimizde basit bir html kodu yazacagiz Göz Kırp

Esen kalin

T.T.K



Facebook'a Ekle
Kayıtlı

TURK TIMUR ALP
Normal Üye
*
ileti Sayısı: 133



« Yanıtla #1 : 28 Ekim 2010, 00:42:19 »

Soru yoksa bir kaç bilgi daha eklemek istiyorum.

HTML dilinde yazilmis siteler genellikle sayfayi tamamen yazilmis sekilde eksiksiz gösterir. Bu olaya statik yani sabit HTML deriz, degismez.
Simdi dinamik HTML olayini kisaca anlatacagim, degisen sayfalar.

Günümüzde çogu siteler PHP,ASP dilinde kodlanmistir bu siteleri anlamak basittir, özellikle fare ile baglantilara tiklamadan üzerinde durursaniz.
Hal penceresinde asagida "degiskenleri" gösterecektir.

Degiskenler dedigim sabit olmayan veridir; örnek x=y dinamik sekli; x=10 statik sekli;

PHP sitelerinde degiskenlerle karsilasiriz: index.php?uid=100, cid=5; message=65; makale=12 .....
Yukarda uid=100 degeri tasiyor; bunu istersem adres çubugundan uid=101 yapabilirim. Ayni sekilde cid=7; message=87 ve makale degiskeni 25 yapabilirim. Gülümseme bunu ilerde gayet basit bir sekilde anlayacaksiniz.

Özetlemek gerekirse, PHP siteleri baglanan kisiye göre sayfaya dinamik HTML kodlarini gönderir. Aynen bizim otag gibi,
bizim konulari TURKCÜ darbe grubuna dahil olanlarin gördügü gibi. Baskalari göremez, ziyaretçilere daha degisik bir sayfa gösterir, üyelere
daha farkli.

HTML
PHP
ASP
Bunlarin 3'üde site yapiminda kullanilir.

Esen kalin

T.T.K

 
Facebook'a Ekle
Kayıtlı

TURK TIMUR ALP
Normal Üye
*
ileti Sayısı: 133



« Yanıtla #2 : 28 Ekim 2010, 01:19:12 »

Geçelim simdi basit dersimize.

Otagimizda konu ileti açarken karsimiza metin editörü çikar. Peki bu editörde yukarda bazi isaretler var nedir onlar. Bunlar otaga ait kodlardir, ismi ise BCC kodlari.
Bunlari listelemek gerekirse:

Kod:
[b],[i],[u]
3 tane etiket listeledim andalar fazlasina gerek yok mantigi hemen anlayacaksiniz.

Kod:
[b]TANRI TURKU KORUSUN[/b]
yazarsak yazimiz kalin sekilde gözükecek : TANRI TURKU KORUSUN

Kod:
[i]TANRI TURKU KORUSUN[/i]
 yazmis olursak çapraz sekilde gözükecek  : TANRI TURKU KORUSUN

Kod:
[u]TANRI TURKU KORUSUN[/u]
yazmis olursak alti çizilmis sekilde gözükecek : TANRI TURKU KORUSUN


..... Peki HTML ile ne ilgisi var diye sorarsaniz ... Mantik ayni kandaslar.
Tek fark su sekilde :

Kod:
<b>TANRI TURKU KORUSUN</b>
;   dikkatli olun kandaslar; önce etiketi açiyoruz
Kod:
<b>
... yazimizi yaziyoruz sonra kapatiyoruz
Kod:
</b>

Yukardaki BCC kodlarini HTML diline çevirmek istemis olursak su sekilde yazacagiz.

Kod:
<b>TANRI TURKU KORUSUN</b>
<i>TANRI TURKU KORUSUN</i>
<u>TANRI TURKU KORUSUN</u>

Etiketler yani komutlar büyük küçük harf farketmez, gönlünüze göre kandaslar.

Esen kalin

T.T.K

Facebook'a Ekle
Kayıtlı

TURK TIMUR ALP
Normal Üye
*
ileti Sayısı: 133



« Yanıtla #3 : 28 Ekim 2010, 01:33:04 »

Tamamda bu kodlari biz nasil deneyecegiz ?


Basit: Ilkin Notepad metin programini açiyoruz.
Içerisine ilk kodu yazacagiz, basit olsun bu arada 2 tane yeni komut ve iç içe yazmalarida görecegiz andalar.
Kullanilan komutlar:
Kod:
<b> ; <font color> ve <size>
b= kalin yazi
font color=yazi rengi;
size= yazi boyutu

Kod:
<b><font color=red size=12>TANRI TURKU KORUSUN</font></b>

Bu kodu metin programina yaziyoruz. Sonra farkli kaydet diyoruz ve dosya ismini veriyoruz.....
dikkat ..... dosyamizin ismini ben test.html yaptim, yani çalismasi için kesinlikle HTML uzantisi
olmasi gerekiyor.

Dosyamiz kaydedildi hatta masa üstünde duruyor, fareyle aliyoruz direk TARAYICIMIZIN içine atiyoruz
kos koca TANRI TÜRKU KORUSUN YAZIYOR ... renk KIRMIZI .
Adres çubuguna dikkat edin, orada kendi bilgisayarinizin dizini yaziyor...
CTRL+U yapiyoruz bizim kod gözüküyor Göz Kırp


Bu günlük bu kadar kandaslar kolay gele.

T.T.K
Facebook'a Ekle
Kayıtlı

TURK TIMUR ALP
Normal Üye
*
ileti Sayısı: 133



« Yanıtla #4 : 28 Ekim 2010, 21:43:26 »

Esenlikler kandaslar

Dün yaptigimiz ilk html kodunu biraz gelistirelim, temel kodu degistirmeyecegiz fakat
yeni eklenti yapacagiz.

Dünkü kodu görelim, ne yazmistik metin dosyasina ?

Kod:
<b><font color=red size=12>TANRI TURKU KORUSUN</font></b>

Sonuç olarak ekranda beyaz fon üstünde kirmizi koskoca TANRI TURKU KORUSUN çikarmayi basarmistik.

Peki simdi satir atlayalim yani yazdigimiz cümlenin pesine degilde alta geçelim, bunu yapmak için break yani KES, yada KIR manasinda bir kod kullanacagiz:
Kod:
<br>

Yeni kodumuz su sekilde :
Kod:
<b><font color=red size=12>TANRI TURKU KORUSUN</font></b>
<br>
Bunu bu sekilde denemis olursak sonuç ayni sekilde olacak çünki ekledigimiz yeni BREAK kodu gözükmez sadece
satir atlar.
Simdi kodumuza dügme ekleyelim kandaslar, iyi takip edin çok basit.

Kod:
<b><font color=red size=12>TANRI TURKU KORUSUN</font></b>
<br>
<button type="button" onclick="JavaScript: alert('TANRI TURKU KORUSUN')">
TIKLA Kandas
</button>

Zamani gelince HTML dili olsun baska bir dil olsun, bunlari kitap gibi okursaniz o zaman çok ileri dereceye ulasmissiniz demektir kandaslar.
Kodun TÜRKCESINI yaziyorum Gülümseme

<kalin><karakter rengi=KIRMIZI boyut=12> *****yazimiz*** <karakter isaretini kapat><kalin isaretini kapat>
<satir atla basa geç>
<dügme tip=dügme  TIKLARSA o zaman Javascripti çalistir: ileti penceresinde su metni yaz ('TANRI TURKU KORUSUN')">
dügmenin üzerindeki yazi=TIKLA Kandas
<dügme isaretini kapat>

Buraya kadar anladiniz degil mi kandaslar; ekledigimiz yeni kodun ayrintilarini verecegim.

Button= dügme
tip= dügme
onclick= TIKLARSAK.
Javascript = ekranimiza javascript ALERT fonksiyonu ile Pencere açacak. TIKLAMAZ isek bir sey yapilmiyor.

Tekrar kodu yaziyorum, metin belgesini açiyoruz ve içeriye sunu yaziyoruz:

Kod:
<b><font color=red size=12>TANRI TURKU KORUSUN</font></b>
<br>
<button type="button" onclick="JavaScript: alert('TANRI TURKU KORUSUN')">
TIKLA Kandas
</button>
Farkli kaydet diye açiyoruz dosyamizin ismini test.html olarak kaydediyoruz, masaüstüne kaydetmis isek
fareyle alip tarayici penceresin atiyoruz sonuç su sekilde çikacak Gülümseme



Inaniyorum ki basardiniz kandaslarim;
Dügmeyi Tikladiktan sonra pencere açiliyor size bir ödev verecegim.
onclik=eger TIKLANIRSA yerine "onmouseover" yazin , farki görün.
onmouseover= eger pointer (neydi TÜRKCESI ?) farenin OK isareti dügmenin üzerinden geçerse diyor.

Kolay gele

T.T.K

Facebook'a Ekle
Kayıtlı

TURK TIMUR ALP
Normal Üye
*
ileti Sayısı: 133



« Yanıtla #5 : 28 Ekim 2010, 22:24:57 »

Yukardaki kodu anladiginiza inaniyorum.

Biraz daha devam edelim, hafta sonu oldugundan gelecek haftaya kadar ders eklemeyecegim Göz Kırp HTML'i tamamen kavramis olacagiz.

Kodumuzu hatirlatalim hepsini.

Kod:
<b><font color=red size=12>TANRI TURKU KORUSUN</font></b>
<br>
<button type="button" onclick="JavaScript: alert('TANRI TURKU KORUSUN')">
TIKLA Kandas
</button>

Hepsini anladik kabul edelim Göz Kırp Simdi üzerinde duracagim nokta ise button yani "dügme".

button type=button yazdik peki baska ne yazariz tip olarak;
Type hiç bir zaman degismez dügme tipi olarak geçer yani "button type=" ... peki kaç çesti tip var ?
3 çesit tip var onlarin birisini görmüs olduk: button yani dügme , 2'incisi reset, 3=submit.

Buton type=button  = dügme   --- bunu gördük
Buton type=reset    = SIFIRLA --- bunu görelim
Buton type=submit  = Gönder  --- ilerde görecegiz ... Form doldurdugunuzda bilgileri SUNUCUYA gönderiyor


Peki ayni kodla devam edelim ki kafaniz karismasin alta devam edecegiz kandaslar.

Kod:
<b><font color=red size=12>TANRI TURKU KORUSUN</font></b>
<br>
<button type="button" onclick="JavaScript: alert('TANRI TURKU KORUSUN')">
TIKLA Kandas
</button>
<br>
<form>
  Isim: <input type="text" name="isim" /><br />
  <button type="reset" value="Reset">Reset</button>
</form>
 

Tekrardan satir atladik ve FORM olusturduk çünki baska dügme tipi görecegiz; SIFIRLA dügmesi.

Buraya kadar tamamda yeni komutlar çikti ortaya onlar nedir ? Anlatacagim kandaslar
Neymis ilk komut ? FORM komutu, isareti konulmus ve en allta kapatilmis.

Arasinda isim diye bir degiskeni isaret etmisiz burayi istediginiz sekilde yazin sorun degil. Simdi biraz dikkat
 input type=text name=isim  ve isaret kapanmis
Diyor ki : Girdi TIPI=yazi tipi ismi ise isim diyor; galiba bu dersi iyi anlatamayacagim Göz Kırp
sonra BREAK kullanmisiz satir atlamak için
ve en son tekrardan bir dügme yapmisiz ; burada ki 2 inci dügme tipi ise RESET=SIFIRLA

Mantik su , veri formu olusturuyoruz, oraya yazi yazacagiz, yazidan sonra SIFIRLA dügmesini TIKLADIGIMIZDA
yazi kalkacak yani SIFIRLANACAK : BEN TEKRAR kodu ekleyeyim sizde notepad metin dosyasinda denemeler yapin:
Adres çubuguna dikkat edin , eger SIFIRLA dügmesine tiklamazda ENTER'e basarsak adres çubugunda isim degiskeninin
degerini ögrenecegiz ki bu ders düsünülerek yapilmistir Göz Kırp
Baska dikkat edeceginiz konu ise yazi boyutu; 12 çünki ilk basta 12 demistik degistirmedik, dügmeleri bu boyut etkilemez,
yalniz tüm yazilari etkiliyor taa ki yeni boyut belirleninceye kadar.


Kolay gele

T.T.K

Kod:
<b><font color=red size=12>TANRI TURKU KORUSUN
<br>
<button type="reset" onclick="JavaScript: alert('TANRI TURKU KORUSUN')">
TIKLA Kandas
</button>
<br>
<form>
  isim: <input type="text" name="isim" /><br />
  <button type="reset" value="Reset">SIFIRLA</button>
</form>

Sonuç :








Facebook'a Ekle
Kayıtlı

BOĞAÇHAN.
Normal Üye
*
ileti Sayısı: 524



« Yanıtla #6 : 28 Ekim 2010, 23:02:06 »

Köprülerin (Linklerin) Görülmesine İzin Verilmiyor.
Köprüleri (Linkleri) Görebilmek İçin Üye Olun veya Giriş Yapın
Facebook'a Ekle
Kayıtlı
BOĞAÇHAN.
Normal Üye
*
ileti Sayısı: 524



« Yanıtla #7 : 28 Ekim 2010, 23:29:23 »

''>'' bu işaretin tersini yapamıyorum.

Facebook'a Ekle
Kayıtlı
Gök Yeleli Asena
Normal Üye
*
ileti Sayısı: 183


Gök Çeri


« Yanıtla #8 : 28 Ekim 2010, 23:36:41 »

< işaretinin tersi shift ile aynı anda < yaptığımız tuşa dokunarak çıkar. Göz Kırp
Facebook'a Ekle
Kayıtlı

Türkçülük dün bir kaynaktı, bugün bir çaydır. Yarın coşkun bir ırmak olacak ve önünde yabancı duygu ve düşüncelerden gelen bütün engeller yıkılacaktır. - Türkçülük insanlara hiç bir vaatte bulunmuyor, maddi veya manevi bir şeyvermiyor. Yalnız istiyor... Fedakarlık ve feragat istiyor. ATSIZ
TURK TIMUR ALP
Normal Üye
*
ileti Sayısı: 133



« Yanıtla #9 : 30 Ekim 2010, 21:15:32 »

Esenlikler degerli kandaslar

Bizim basit HTML kodlarini denemek için güzel bir site ekleyecegim. Inaniyorum ki hafta sonunu denemelerle geçirmenizi saglar.

Gördügümüz komutlarla ugrasin, gönderdigim site HTML kodlarini hemen çeviriyor. Hangi kodlari görmüstük ?
Kod:
<b> , <br>, <font color=blue size=8> ....

Dügmeleride kullanabilirsiniz fakat benden sizlere bir süpriz Göz Kırp 2 komut daha verecegim.

Baska siteden resim eklemek: Resim olsun yazi olsun ekranin sol kösesine degilde ortasina eklemek.
Neymis bu komutlar ? Basit basit... TÜRK'e hersey basit.

Kod:
<center> yazi veya resim</center>
Hem yazi hemde resmi ortaliyor.

Yazi yazmak istersek:
Kod:
<center>TANRI TURKU KORUSUN</center>

Resim eklemek istersek biraz degisik, fakat mantik sudur: Resmin kaynaginida yazmamiz gerek. Sonuç olarak kod su sekilde.
Bizim yukardaki küçük logoyu ekleyelim kandaslar.

Kod:
<center><img src=http://img99.imageshack.us/img99/6213/turkcuturanci.gif></center>

Ne diyor yukarda ?  Ortala + resim kaynak=Resmin oldugu köprü +resim isaretini sonlandir + ortalama isaretini kapat.

Burada img isaretini kapatmadim .. neden diye sorarsaniz gerekmez çünki "center" isareti resim isaretini de kapatmis oluyor.

Simdi ONLINE HTML çeviri sitesini ekleyecegim. : Köprülerin (Linklerin) Görülmesine İzin Verilmiyor.
Köprüleri (Linkleri) Görebilmek İçin Üye Olun veya Giriş Yapın
http://htmledit.squarefree.com/


Oraya isterseniz kodumuzu deneyelim; Kodumuz ve benim eklediklerim... yani alta geçip devam etmisim.

Kod:
<center><img src=http://img99.imageshack.us/img99/6213/turkcuturanci.gif></center><br>
<b>
<font color=blue size=8>TANRI TURKU KORUSUN</font>
<font size=4> Anladiniz degil mi kandaslarim ? satir atlamamisim :) Atlayalim </font>
<br>
<font size=6>
<u>Atladik :) Resmi bir kez daha çagiralim bu sefer basa olsun</u>
<br>
<br>
<img src=http://img99.imageshack.us/img99/6213/turkcuturanci.gif>
<center> ANLADINIZ MI ? </center>
<br>
T.T.K

Kullanilan komutlar:

b : (Bold) Kalin yazi tipi
font color=blue size=8  : Karakter rengi=mavi boyut=8

color su sekilleri alabilir : RenkRenkRenkRenkRenkRenkRenkRenkRenkRenkRenkRenk
black, red, yellow, pink, green, orange, blue, purple, beige, brown, teal, navy, maroon, limegreen



center : Ortala
img src= Image source : Resmin bulundugu kaynak
br = Break(Kes veya KIR) Satir atla
u = (Under ligne) Alt çizgi


Sali gece görüsmek üzere , kolay gele.

T.T.K
Facebook'a Ekle
Kayıtlı

Sayfa: [1] 2
  Yazdır  
 
Gitmek istediğiniz yer:  

|Harita | Arşiv | 1 | 2 | 3 | 4 | XML | Rss
PHP Kullanıyor Powered by SMF 1.1.20 | SMF © 2006-2009, Simple Machines

Google'a ekle
BOZKURT FM*
XHTML 1.0 Uyumlu! Dilber MC teması HarzeM tarafından
Bu Sayfa 0.048 Saniyede 23 Sorgu ile Oluşturuldu (Pretty URLs adds 0.011s, 2q)


Türkçü Turancı Otağ
Otağımıza üye olarak Türklüğe ve Türkçülüğe katkıda bulunabilirsiniz.
10 saniyede üye olmak için tıklayın.