SERSERİ PC TEKNİK
S3RS3R!-PCYönetimi
Html Kod Kullanımı Detaylı Anlatım  Mtrmrn
SERSERİ PC TEKNİK
S3RS3R!-PCYönetimi
Html Kod Kullanımı Detaylı Anlatım  Mtrmrn
SERSERİ PC TEKNİK
Would you like to react to this message? Create an account in a few clicks or log in to continue.



 
AnasayfaAramaLatest imagesKayıt OlGiriş yap

 Konu Etiketleri Etiketler
 Konu Linki Konu Linki
 Konu BBCode BBCode
 Konu HTML Kodu HTML Kodu
Paylaş | 
 

 Html Kod Kullanımı Detaylı Anlatım

Önceki başlık Sonraki başlık Aşağa gitmek 
YazarMesaj
Qnur
Yeni Üye
Yeni Üye
Qnur

Giriş Tarihi : 05/02/11
Yer : neden
Mesajlar : 3
Rep Puanı : 0
Rep Gücü : 9

Html Kod Kullanımı Detaylı Anlatım  Empty
etiketini, her yeni sütun için ise

Tablolari icice de kullanmamiz mumkun. Bu sekilde bir kullanimla bir www sayfasindaki resim ve yazilari tam istedigimiz gibi konumlandirmamiz mümkün olur.

UMARIM İŞİNİZE YARAR HER KONUMDA OLDUĞU GİBİ BUDA TAMAMEN KENDİ ÇALIŞMAMDIR UMARIM YARDIMIM DOKUNMUŞTUR İYİ FORUMLAR...

MesajKonu: Html Kod Kullanımı Detaylı Anlatım    Html Kod Kullanımı Detaylı Anlatım  Icon_minitimeC.tesi Şub. 05, 2011 5:24 pm


Evet arkadaşlar bazı arkadaşlarım bu kodlamayla ilgili sorun çekiyorlar eminim sizde veya sizin arkadaşlarınızda çekiyor olabilir bunun için detaylı bi anlatım hazırlamaya karar verdim fazla uzatmadan konuma giriyorum herhangi bi sorunuz olursa ö.m atmanız yeterli eğer konu uzunsa msn ninizi yazın ben eklerim ordan hallederiz konumuza geçiyoruz...

İlk olarak HTML kod kullanım ve komutlarını anlatıcam arkadaşlar bu başlık içinde;

1)Temel bilesenler: html, head, title, meta ve body
2)Renkler, body, font, ve h1..h6 Kaynakwh webhatti.com:
3)Yazilari bicimlendirmek: kalin, yatik, ortalanmis, vs. ...
4)Sayfada resim gostermek
5)HTML sayfasina bag (link) yerlestirmek
6)Ekran duzenine iliskin daha cok komut
7)Sayfalarda tablo kullanimi


İkinci olarak ileri düzey birkaç şey anlatacağım örneğin;

1)Sayfalara 'meta' komutu ile kimlik vermek
2) Resimlerde 'MAP' kullanimi
3) Dinamik HTML(Hareketli)

HTML kullanımı ve kodları

1)Temel bilesenler: html, head, title, meta ve body

Bir WEB sayfasinin standard bilesenleri sunlardir:

ve : sayfanin baslangic ve bitisini belirtir.

ve : sayfanin baslik bilgileri 'title', 'meta' vs. buraya yerlestirilir.


ve : sayfanin iceriginin ne oldugunun tanitilmasinda kullanilir. Sayfada gorunmez ama netscape bunu sayfayi tanimlamakta kullanir.


: sayfanin icerigi hakkinda www tarayicilarina bilgi saglamak icin gereklidir.


ve : sayfanin iceriginin baslangic ve bitisini belirtmekte ve sayfa hakkindaki genel tanimlamalari yapmakta kullanilir.

Yukaridaki bu komutlarin, bir web sayfasinin icindeki siralari asagidaki gibidir. Bir yazi editoru (joe, pico, xedit, edit, vs.) ile ilk ornegimizi yazarsak:



Bir HTML Denemesi


'Bu sayfa bakim halindedir', ya da 'this page is under construction' web sayfalarinda ille de olmasi gerektigi dusunulen sacma yazilardir.



Aslinda en basit web sayfasi soyle olabilir:


Sakin yapamam diye düsünme dostum!!



sondaki '' yi koymasak dahi www gosterici programi (lynx, netscape, ...) bunu bir HTML sayfasi olarak yorumlayacaklardir.

2)Renkler, body, font, ve h1..h6

Onceki ornekte '' diye, asagidakinin basitlestirilmis bicimini kullanmistik:




Burada font ile kullanilan genel yazilarin rengi,
bgcolor ile arkaplan rengi,
text ile tanimsiz yazilarin rengi,
link ile uzerine gelince el hareketi cekilen yazilarin rengi,
vlink ile de secilmis baglarin rengi belirlenir.


renk belirtmek icin o rengin ingilizce adi ya da RGB degerleri onaltilik systemde verilir. RGB deki siraya gore 00-FF arasi uc deger kullanilir. Hepsi sifir ise hicbir renkten karistirilmaz. hepsi FF ise her renk maksimum oranda kullanilir ve beyaz elde edilir.
Ornegin salt bir kirmizi #FF0000 ile elde edilir.


ve arasindaki yazilar belirtilen renkte yazilir.

ve

den
ve
ya kadar standard yazi tiplerinden biri secilerek yazi yazilir. h1 ile belirtilenler h6 ile taniml******rdan daha buyuktur.


ornegin:

Sayfa basligi icin uygun buyuklukte harfler


Bu harfler sanirim yazi icin yeterliler


Gozleriniz bozuk degilse, ve her gun A vitamini aliyorsaniz bu yazi sizin icin okunabilir olmali.



3)Yazilari bicimlendirmek: kalin, yatik, ortalanmis, vs. ...

Onceki ornekte

,

, ... ile yazilarin buyukluklerini ayarlamanin basit bir yolunu gormustuk. HTML sayfamizin yazilarina biraz daha kisilik kazandirmak icin asagidaki komutlari da kullanabiliriz.

ve arasindaki yazilar koyu gorunur.

ve arasindaki yazilar ise italik basilir.

ve arasindaki yazilar ise yanip soner.

ve
arasindaki yazilar ortalanir.

 ve 
ile sinirlanan yazilarin goruntusunde ayarlama yapilmaz. Yani birden fazla bosluk varsa bunlar bir tane olacak sekilde azaltilmaz.

paragraf basi yapmak icin kullanilir.

4)Sayfada Resim Göstermek

En basit sekliyle, bir sayfaya resim koymak icin asagidaki komut su sekilde;


...


kullanilir.


Burada dosya-adi gosterilecek grafik dosyasinin (gif ya da jpg tipinde) bulundugu yer ve adidir. Baglanilan html sayfasi ile ayni dizinde bulunan resimler icin yer adi belirtmeye gerek yoktur.


Alt ile ise lynx kullanicilarinin gorebilecegi bir aciklama yazmis oluruz.

Align ile de resmin konumunu belirleriz.


Ornegin:


ile resmin saga yanasik olarak cizilmesini saglariz. 'right' yerine 'left', 'center', 'middle' gibi konum bildirici bir baska sozcuk de kullanilabilir.


Ayrica yukaridakilere ek olarak 'border', 'width', 'height' belirteclerini de icinde kullanabiliriz. Bunlardan 'border='i kullanarak resmin cercevesini belirleriz; border=0 dersek hic cerceve cizilmez.

Width ve height ile resmin boyutlarini belirleyebiliriz. Bunlardan sadace birini verirsek, resmin boyutu orantili olarak cizilecektir. Yani demissek, ve de resmimiz aslinda 100 nokta genisliginde 50 nokta yuksekliginde idiyse, ekrana 300 nokta eninde ve 150 nokta yuksekliginde cizilecektir. Her iki degeri de (width=... height=...) kullanmissak, resmin oranini istedigimiz gibi degistirmek mumkun olur.

Bu arada, sayfanin internetten indirilirken hizli gosterilmesini istiyorsak, her resmin width ve height ozelliklerini kullanmaliyiz. Bu sayede browser (gosterici) programiniz resimlerin yuklenmesini beklemeden cevrelerine yazilari yerlestirebilecektir.


Sayfanin hizli geliyor gibi gorunmesini saglamanin bir yolu da 'lowsrc' belirtecini icinde kullanmak. Eger kullandigimiz resimlerin bir de bulanik/niteliksiz/siyah-beyaz ama az yer tutan bir benzerini daha yapar, ve bunu [resim] seklinde tanimlarsak, ilk once hizliresim.gif yuklenip gosterilecektir. Bu sayede bulanik iken yavas yavas netlesmeye baslayan resimler belirir sayfamizda. Bunun yarari ise sayfaniza bakan kisinin cabuk karar vermesini sagliyor olmasindadir.





bir satir atlamak icin kullanilir.



bir cizgi ceker.

5)HTML sayfasına bağ(LİNK)koymak

ve : HTML'nin temeli olan bu komutlarla bag (link) yapilir.

Aciklama Biciminde kullanilir.

Aciklama denilen kisim ister yazi ister bir grafik ya da herhangi bir nesne olabilir. "hedef bag" kismi ise yerel kaynaklari gosteren bir dosya adi ya da uzak bir makinadaki bir baska nesneyi (yazi, grafik, video vs.) gosteren bir bag (link) olur.


Bu linkler, mevcut internet araclarindan biridir.

Ornegin:
http:// ftp:// telnet:// gopher:// news:// bu araclardan bazilaridir.

Bunu kullanirken;


Neye Benzedigimi Gormek Icin Buraya Bas

Yukarida adi gecen resim bu web sayfasi ile ayni dizinde (directory) olmalidir.


Baska sekilde ornekler ise:


Windows95 icin Uygulama dosyalari


NetNews'in Commodore bilgisayarlarina iliskin tartismalari


Ve, internetin en gozde kullanimi: bir web sayfasindan baska bir web sayfasina baglanma:


Turkiye'de nukleer enerji tartismalari


dikkat ettiyseniz yukaridaki ornekte sayfanin hangi dizinde oldugu (...ilker/nukleer/") belli ama hangi dosyada oldugu yazilmamis. Boyle bir durumda gosterici program dosyanin adinin 'index.html' oldugunu ongorur.

Kendi dizininizdeki bir sayfa icin:


Insan Haklari Dernegi ve pismis tavuk icin buraya tiklayabilirsiniz.


6)Ekran düzenine ilişkin daha fazla komut

... : Aradaki yazilar cols= ile belirtilen sutunlara ayrilarak ekrana basilirlar. Sadece Netscape3.0 ve ustunde calisir. Sutun icindeki yazinin sutunun ne kadarini kaplayacagini width parametresi ile belirtiriz. gibi. Burada boslugu yuzde yerine piksel olarak da verebiliriz. Ayrica iki sutun arasindaki boslugu da gutter parametresi ile veririz: yazilar...

: Bununla paragraf baslari icin bosluk birakmak mumkun. Ornegin
ile 48x48 piksellik bir bos kare alan yaratmis oluruz. Burada block yerine vertical ya da horizontal kullanmak da olasi. Ayrica, ile 320x200'luk bir bosluk yaratip bunu ekranda saga dayatmis oluruz. Gene align komutundan sonra right, left, center, absmiddle gibi diger konum belirteclerini kullanabiliriz. Kaynakwh webhatti.com:


: 1 karakterlik bosluk birakmak icin kullanilir. Basit tablolar yapmak icin kullanilabilir. Ornegin:


yil ay gun
--- --- ---



7)Sayfalarda tablo kullanımı

Genel kullanim:




sutun 1 yazilari sütun 2 sütun 3.....
2.satirin 1. sütunu2. sütunu3. sütunu



Tablolar satirlar ve sütunlar seklinde ayrilmis hücrelerden olusuyor. Her yeni satira baslamak için

etiketini kullaniyoruz.


Bir örnek ile incelersek:







Bellek tipleri FPM
EDO
SDRA M
DDR RAM
RAMBus
Disk tipleri MFM/RLL
ATA IDE
ULTRA ATA
SCSI
Islemci tipleri RISC
CISC



Burada 2x3'lük bir tablo olusturduk. Tablomuz 1 pixel kalinliginda cerceveye sahip (border=1), tablo sayfada 200 pixel genisliginde yer tutacak (width=200), hücreler arasI 2 pixell bos ve 2 pixellik bir kalinlik efektimiz var (cellspacing ile cellpadding).


Örnekte hücre genisliklerin yazI uzunluguna göre otomatik ayarlanmamsI için genislikleri kendimiz belirledik (width="50%"). Bunu pixel olarak da belirlememiz mümkündü:
ile.

Hücreler içindeki yazIlarIn nasIl yerlestirilecegini ise align="yer" ile belirtiyoruz. Burada "yer" yerine "top", "bottom", "left", "right" ve "center" kullanabiliriz.


Ve eger, bir hücrenin iki hücre genisliginde veya yüsekliginde olmasini istiyorsak colspan ve rowspan seçeneklerini de kullaniyoruz. Önceki örnege bir baslik ekleyecek olursak:

Bilgisayar Ana Bilesenleri
Sayfa başına dön Aşağa gitmek
 

Html Kod Kullanımı Detaylı Anlatım

Önceki başlık Sonraki başlık Sayfa başına dön 

 Similar topics

-
» HTML DERSLERİ
» öSS 2008 VİDEOLU ANLATIM -
»  Mukkemmel Bır Logo Yapımı - Photoshop (Resimli Anlatım)
» Windows Vista Oyun Sorunu │ Çözüm │ Anlatım
» Facebook'tan Kalıcı Olarak Üyelik Silmek ( Anlatım )
1 sayfadaki 1 sayfası

Bu forumun müsaadesi var:Bu forumdaki mesajlara cevap veremezsiniz
SERSERİ PC TEKNİK :: WEB MASTER :: Web Tasarım & ASP & PHP & HTML & Kodlama-
Buraya geçin: