HTML KODLARI etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
HTML KODLARI etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

9 Haziran 2011 Perşembe

Web Sayfasına Resimli Arka Plan Yapmak

Sevdiğiniz, beğendiğniz ya da yaptığınız tasarıma uygun olduğunu düşündüğünüz bir resmi web sayfanızın arka planı olarak kullanabilirsiniz. Bunun için HTML dosyanızın <body > tagının içine "background" parametresini kullanarak istdiğiniz resmi (jpg ,gif ya da png) arkaplan olarak belirleyebilirsiniz. İstediğiniz bir resmi arkaplan yapmak için,

< body background="arlaplan.gif" >
....................
....................
...................< /body >

şeklinde bir kodlama yeterlidir. "background" parametresine değer olarak arkaplan resminin konumu verilir. Burada dikkat edilmesi gereken husus adresin doğru olarak verilmesidir. Aksi takdirde resim görüntülenmez. Bu işlem sonucunda seçtiğiniz resim sayfanın arka planına döşeme şeklinde (sayfa boyunca tekrar ederek) yerleşir.

Artık günümüzde arkaplan resmini yerleştirmek için CSS kodlarından faydalanılmaktadır. CSS kodları web tasarımda nesnelerin yerleştirilmesi için HTML kodlarına göre daha çok imkan tanımaktadır. Bunu bir örnek ile açıklayalım.

< body style="background:url(arkaplan.jpg); background-repeat:no-repeat;" >
....................
....................
...................< /body >

Son olarak tag içinde kullanılan parametreleri de açıklayalım,

background-repeat : Arkaplan resminin tekrarlanma şeklini belirlemek için kullanılır. Dört farklı değeri vardır.

no-repeat : Tekrarlama olmaz.
repeat : Resim tüm sayfa boyunca döşenir.
repeat-x : Yatay doğrultuda döşeme yapar.
repeat-y : Düşey doğrultuda döşeme yapar

8 Haziran 2011 Çarşamba

HTML Kodları ile Web Sayfasının Arkaplan Rengini Değiştirmek

Web sayfanızın arkaplan rengini değiştirmek için < body > tagının "bgcolor" parametresine o rengin ingilizce adını (red, yellow, white, black gibi) ya da onaltılık sistemde hazırlanmış renk kodunu girmeniz yeterlidir. Arkaplan rengi şu şekilde değiştirilir.

< body bgcolor="red" >
............
...........bu kısımda diğer sayfa elemanları bulunur.
...........
...........
< /body >

Bu kodlama ile sayfa arkaplanı kırmızı olarak değiştirilir. Burada "bgcolor" için red yerine onun hexadesimal(onaltılık) RGB kodu olan #FF0000 da yazılabilir. Sonuç aynıdır. Hexadesimal sayı sistemi 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F elemanlarından oluşur.

Burada RGB sisteminden de bahsedelim. RGB, Red-Green-Blue (Kırmızı-Yeşil-Mavi) ışık renklerinin karışımı ile diğer renklerin elde edilmesine dayalı bir renklendirme standardıdır. Her renk için hexadesimal sayılardan oluşan bir sayı çifti bulunmaktadır. Bu çiftlere verilen değere göre istenilen renk elde edilebilir. Konunun daha iyi anlaşılabilmesi için RGB sistemini bir tablo haline getirdim.

RENKLERKIRMIZIYEŞİLMAVİ
KODLAR#0,1,2..A,B,..F0,1,2..A,B,..F0,1,2..A,B,..F



Laptoplarla ilgili piyasa - fiyat araştırmalarım için => LapTopCanavarı

29 Mayıs 2011 Pazar

HTML Metin Hizalama

Web sayfanıza yerleştirmek istediğiniz metin içeriğnin daha güzel görünmesi ve özellikle sayfa tasarımıyla uyumlu olması için metnin uygun bir biçimde hizalanması gerekir. Hizalama işlemi CSS kodları ile yapılır. Hizalama işlemi için metni işaretlemekte kullandığımız herhabgi bir HTML tagının (< div >, < b >, < p > gibi) içinde, "text-align" kodunun parametrelerine "left, right, center ve justify" değerlerinden birini yazmamız yeterli olacaktır. Ben aşağıdaki metinleri < div > tagının içinde hizaladım. İşte size bir hizalama örneği,

< div style="text-align: left; border:solid #333;" >
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed a dictum augue. Nulla facilisi. Vestibulum commodo tellus nec urna posuere cursus. Nam nec odio magna. Praesent vulputate elementum erat, vel tincidunt nisi ullamcorper at. Nulla cursus, lectus eu dignissim porta, massa ante pulvinar orci, hendrerit accumsan libero sem id turpis. Curabitur bibendum aliquet porta. Duis porta convallis scelerisque. Curabitur id lectus nulla, ac mattis quam. Aliquam malesuada feugiat turpis a aliquet. Phasellus faucibus magna lobortis lectus semper vel scelerisque risus hendrerit. Integer tristique eros in augue suscipit tristique. Duis dui felis, vulputate scelerisque rutrum in, cursus in urna. Nam placerat condimentum odio at adipiscing. Curabitur posuere lacus in magna cursus a sagittis est dignissim.< /div >

"text-align" ile hizalanan metinler şu şekillerde görüntülenir;

text-align:left (sola yasla)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed a dictum augue. Nulla facilisi. Vestibulum commodo tellus nec urna posuere cursus. Nam nec odio magna. Praesent vulputate elementum erat, vel tincidunt nisi ullamcorper at. Nulla cursus, lectus eu dignissim porta, massa ante pulvinar orci, hendrerit accumsan libero sem id turpis. Curabitur bibendum aliquet porta. Duis porta convallis scelerisque. Curabitur id lectus nulla, ac mattis quam. Aliquam malesuada feugiat turpis a aliquet. Phasellus faucibus magna lobortis lectus semper vel scelerisque risus hendrerit. Integer tristique eros in augue suscipit tristique. Duis dui felis, vulputate scelerisque rutrum in, cursus in urna. Nam placerat condimentum odio at adipiscing. Curabitur posuere lacus in magna cursus a sagittis est dignissim.


text-align:center (ortala)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed a dictum augue. Nulla facilisi. Vestibulum commodo tellus nec urna posuere cursus. Nam nec odio magna. Praesent vulputate elementum erat, vel tincidunt nisi ullamcorper at. Nulla cursus, lectus eu dignissim porta, massa ante pulvinar orci, hendrerit accumsan libero sem id turpis. Curabitur bibendum aliquet porta. Duis porta convallis scelerisque. Curabitur id lectus nulla, ac mattis quam. Aliquam malesuada feugiat turpis a aliquet. Phasellus faucibus magna lobortis lectus semper vel scelerisque risus hendrerit. Integer tristique eros in augue suscipit tristique. Duis dui felis, vulputate scelerisque rutrum in, cursus in urna. Nam placerat condimentum odio at adipiscing. Curabitur posuere lacus in magna cursus a sagittis est dignissim.


text-align:right (sağa yasla)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed a dictum augue. Nulla facilisi. Vestibulum commodo tellus nec urna posuere cursus. Nam nec odio magna. Praesent vulputate elementum erat, vel tincidunt nisi ullamcorper at. Nulla cursus, lectus eu dignissim porta, massa ante pulvinar orci, hendrerit accumsan libero sem id turpis. Curabitur bibendum aliquet porta. Duis porta convallis scelerisque. Curabitur id lectus nulla, ac mattis quam. Aliquam malesuada feugiat turpis a aliquet. Phasellus faucibus magna lobortis lectus semper vel scelerisque risus hendrerit. Integer tristique eros in augue suscipit tristique. Duis dui felis, vulputate scelerisque rutrum in, cursus in urna. Nam placerat condimentum odio at adipiscing. Curabitur posuere lacus in magna cursus a sagittis est dignissim.


text-align: justify (iki yana yasla)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed a dictum augue. Nulla facilisi. Vestibulum commodo tellus nec urna posuere cursus. Nam nec odio magna. Praesent vulputate elementum erat, vel tincidunt nisi ullamcorper at. Nulla cursus, lectus eu dignissim porta, massa ante pulvinar orci, hendrerit accumsan libero sem id turpis. Curabitur bibendum aliquet porta. Duis porta convallis scelerisque. Curabitur id lectus nulla, ac mattis quam. Aliquam malesuada feugiat turpis a aliquet. Phasellus faucibus magna lobortis lectus semper vel scelerisque risus hendrerit. Integer tristique eros in augue suscipit tristique. Duis dui felis, vulputate scelerisque rutrum in, cursus in urna. Nam placerat condimentum odio at adipiscing. Curabitur posuere lacus in magna cursus a sagittis est dignissim.

Not :
Metinlerdeki garip yazı dikkatinizi çekmiştir. Örnek metni Lorem Ipsum' dan aldım. Bu da nedir yahu? diyorsanız işte size sitesinden kısa bir açıklama,

"Lorem Ipsum, dizgi ve baskı endüstrisinde kullanılan mıgır metinlerdir. Lorem Ipsum, adı bilinmeyen bir matbaacının bir hurufat numune kitabı oluşturmak üzere bir yazı galerisini alarak karıştırdığı 1500'lerden beri endüstri standardı sahte metinler olarak kullanılmıştır. Beşyüz yıl boyunca varlığını sürdürmekle kalmamış, aynı zamanda pek değişmeden elektronik dizgiye de sıçramıştır. 1960'larda Lorem Ipsum pasajları da içeren Letraset yapraklarının yayınlanması ile ve yakın zamanda Aldus PageMaker gibi Lorem Ipsum sürümleri içeren masaüstü yayıncılık yazılımları ile popüler olmuştur."

Eğer bu kadar bilgi sizi tatmin etmediyse, ayrıntılı bilgi ve örnek yazı almak için Lorem Ipsum dan yararlanabilirsiniz.

25 Mayıs 2011 Çarşamba

Web Sayfasına Button Eklemek


Butonlar web sitelerinin kullanıcı kayıt formlarında ya da üye giriş panellerinde sıklıkla karşılaştığımız HTML form elemanlarıdır. Kendilerine verilen işleve bağlı olarak, tıklandıklarında formdaki ya da paneldeki bilgileri sunucuya iletmekten tutun da kullanıcıyı başka bir HTML sayfasına yönlendirmeye kadar pek çok işi yaparlar. Web sayfalarına buton <input type="button(veya submit") / > tagı ile eklenir. Şimdi bunu bir örnek üzerinde açıklayalım,

<input type="button" value="Gönder" name="buton1" title="Düğmeye bas" onclick="parent.location='http://www.google.com'"/>
< input type="reset" value="sil" name="silgi" title="Temizle"/>

Bu kodlamanın sonucu sayfada şu şekilde görüntülenir.


Son olarak bu tag içindeki parametreleri açıklayalım.

name : Button'u isimlendirmek için kullanılır. Burdan alınan bilgilerin sunucudaki programda işlenmesi için gereklidir.

title : Kullanıcı fare ile buton üzerine geldiğinde görüntülenmesi istenen bilgi mesajı için kullanılır.

value : Buton üstüne yazı yazmak için kullanılır.

Yukarıda turuncu ile işaretlenmiş iki tane parametre var. Birincisinde bulunan onclick="parent.location='http://www.google.com'" ifadesinde onclick ziyaretçinin butona tıklaması olayıdır. "parent.location" ise butona tıklandığında ziyaretçinin belirtilen web sayfasına yönlendirilmesi için kullanılılan javascript kodudur. İkincisi ise type="reset" ile butona form sayfasındaki bilgileri silme özellği kazandırmak için kullanılır.


24 Mayıs 2011 Salı

Blogger'a swf Flash Eklemek

Sitenizde ziyaretçilerinize hoşça vakit geçirtmek için flash oyunlar koymak istiyor. ve karmaşık javascript kodları ile uğraşmak istemiyorsanız < embed / > tagı'nı kullanabilirsiniz.İşte size bunun bir örneği,

< embed src="oyun.swf" height="349" width="425" / >

Burada "src" parametresine swf dosyasının konumunu yazıyoruz. Peki bloguma flash oyun nasıl eklerim dediğinizi duyar gibiyim. Bildiğiniz gibi Blogger swf uzantılı dosyaları eklemeye izin vermiyor. Bu durumda önce swf dosyamızı internette bulacağımız ücretsiz depolama sitelerinden birine(Fileden, swfcabin, googlesites gibi) yüklemekle işe başlıyoruz. Bu herhangi bir ftp sunucusu da olabilir. Sonra bu dosyanın adresini alıyoruz ve "src" parametresinin karşısına yazıyoruz. Böylelikle blog sayfanız görüntülendiğinde oyunun swf dosyası sizin belirttiğiniz adresten sayfanıza yüklenir ve kullanıcı oyunu rahatlıkla oynamaya başlayabilir. Tabi burda yüklenme süresi normal sitelere göre biraz daha uzun olabilir ama oyun bir kere yüklendikten sonra sorunsuz çalışacaktır.

Yok ben yüklemeyle uğraşmak istemiyorum da diyebilirsiniz. Bu durumda bir alternatifiniz daha var. Oyun sitelerinden beğendiğiniz bir oyunun o site üzerindeki konumunu belirleyip adres olarak orayı gösterebilirsiniz. Ancak bu durum anlaşılırsa site sahibi ile aranızda tatsız olaylar gelişebilir. Ben swf dosyamı google sites üzerinde bir adrese yükledim. Google sites Türkiye'de hala yasaklı olabilir bu durumda oyunu göremeyebilirsiniz. Oyunu görmek istiyorsanız ağ bağlantılarınızdan DNS ayarlarınızla oynamanız gerekir.

Size kullanabileceğiniz iki DNS adresi vererek yazımı bitiriyorum.

64.81.79.2
128.107.241.184

Oyun görüntülenmiyorsa DNS olarak bu numaraları girin. İyi eğlenceler...


Web Sayfasına Textbox (Yazı Kutusu) Eklemek

Textboxlar web sitelerinin kullanıcı kayıt formlarında veya üye giriş panellerinde sıkça rastladığımız, üyelerin ya da üye olacak ziyaretçilerin ad, soyad kullanıcı adı, şifre v.b. bigilerini toplamak için kullanılan HTML form elemanlarıdır. Web sayfasına textbox; için < input type="text" / > tagı ile eklenir. Bu tagın genel kullanılış biçimi şu şekildedir,

< input maxlength="40" name="ad" title="Adını Yaz" type="text" value="Kullanıcı Adı" width="150" height="20" / >

Daha iyi anlaşılması açısından bu tag'ın nasıl kullanıldığını bir örnek üzerinde gösterelim.

Kullanıcı Adı : < input type="text" name="ad" value="e-mail adresiniz" title="Kullanıcı Adını Yaz" maxlength="40" width="150" height="20" / > < br/ >
Şifre : < input maxlength="15" name="ad" title="Şifreni Yaz" type="password" value="" width="150" height="20" / >

Bu kodlamanın sonucu aşağıdaki gibi görüntülenir,

Kullanıcı Adı :

            Şifre :

Son olarak bu tag içindeki parametreleri de açıklayalım.

name : Textbox'u isimlendirmek için kullanılır. Burdan alınan bilgilerin sunucudaki programda işlenmesi için gereklidir.

maxlenght : Textbox'a girilecek karakter sayısını kısıtlamak için kullanılır.

height : Kutu yüksekliğini belirlemek için kullnılır.

width : Kutu genişliğini belirlemek için kullanılır.

value : Textbox'a ilk değerini vermek için kullanılır. Buraya yazdığınız yazı kutu içinde görüntülenir. Kullanıcını kutuya herhangi bir değer(ad, soyad bilgisi, şifre gibi)girdiği zaman başlangıç değeri değişir ve yeni değer işlenmek üzere sunucuya gider.

title : Kullanıcı fare ile kutu üzerine geldiğinde görüntülenmek istenen bilgi mesajı için kullanılır.

Not : Verdiğim kod örneğinde turuncu ile işaretlediğim yer dikkatinizi çekmiştir. Eğer "type" parametresine değer olarak "password" girerseniz browser kullanıcının girdiği şifreyi göstermez onun yerine yıldız veya içi dolu dairecikler koyar.


23 Mayıs 2011 Pazartesi

Web Sayfasına Radiobutton Eklemek

İnternette gezinirken uğradığınız sitelerin kayıt formlarında sıklıkla karşılaştığınız daire şeklindeki onay kutucukları hepinizin dikkatini çekmiştir. "radiobutton" adı veriilen bu elemanlar kullanıcılara çoktan seçmeli sorular sormak için kullanılırlar. Genelde medeni durum, cinsiyet gibi tek cevap gerektiren sorular sorulurken kullanılırlar. Bu tip elemanlar site sahiplerinin ziyaretçilerle ilgili bilgi toplamalarını kolaylaştırır. Ayrıca günümüzde oldukça yaygınlaşmış olan alışveriş sitelerinde de kulanıcılar için ürün seçimi, fiyat aralığının belirlenmesi, marka seçimi gibi konularda kolaylık sağlar. Gelin şimdi bu minik elemanın nasıl kullanıldığına bir bakalım ;

Radiobuttonlar web sayfalarına < input type="radio" / > tagı ile yerleştirilir. Bu tagın genel kullanımı şu şekildedir,
Siteye kaydolmak isteyen bir ziyaretçinin cinsiyetinin sorgulanması

Lütfen cinsiyetinizi belirtiniz:
< input type="radio" name="cinsiyet" value="k" title="Birini Seçin" />Kadın < br/ >
< input type="radio" name="cinsiyet" value="e" title="Birini Seçin" />Erkek < br/ >

Bu kodlamanın sonucu şu şekilde görüntülenir,

Lütfen cinsiyetinizi belirtiniz:
Kadın
Erkek

Bu tag içindeki parametreleri de açıklayalım.

name : Radiobutonları gruplandırmak için kullanılır. Bu şekilde kullanıcının iki seçenekten yalnızca birini seçebilmesi sağlanır. İsimler farklı olursa iki seeçenek de işaretlenebilir. Bu da kullanıcı bilgilerinde karmaşaya yol açar. Bu yüzden aynı türden seçmeli sorularda radyobutonlara verilen isimler de aynı olmalıdır.

value : Radyobutondan yapılan seçimle ilgili bir değerin sunucuya aktarılması için kullanılır. Aktarılan değer sunucuda işlenir ve veri tabanına kaydedilir. Mesela bu örnekte erkek seçilirse sunucuya "e" değeri yollanmış olur.

title : Fare ile radiobutton üzerine gelindiğinde görüntülencek bilgi mesajı için kullanılır.

21 Mayıs 2011 Cumartesi

Resimlere Link Vermek

Web tasarımda görsellik herşeyden önce gelir. Görsel öğeler metinlere göre daha dikkat çekicidir ve anlaşılması kolaydır. Web sayfanızın içeriğini uygun görsellerle donatırsanız ziyaretçileriniz sayfada gezinirken zorlanmaz. Görsel öğeler sayfa kullanımını kolaylaştırır. Bu sebeple tasarımcı sayfayı hazırlarken resimlerden olabildiğince çok faydalanmalıdır. Resimlere link vermek buna örnek olarak gösterilebilir. Mesela bağlantıları;

Hotmail
Google
Yahoo
Bing
Facebook

Yapmak yerine,







Şeklinde resimlere link vererek web sayfanızı daha kullanışlı hale getirebilirsiniz. Sayfaya resim eklemek için < img/ > tagı kullanılır. Linkler < a > < /a > tagı ile verilir. Resme link vermek için < img/ > tagını < a > < /a > tagları arasına koymak gerekir. Şimdi bunun nasıl yapıldığını gösterelim;

< a href="http://www.facebook.com" target="_blank" title="Facebook" ><img src="facebook.jpeg" alt="Facebook" /> < /a >

Bu kodlamanın sonucu aşağıdaki gibidir;

Facebook


Son olarak taglar içinde gördüğünüz "src", "href", "title", "alt", ve "target" parametrelerini açıklayalım,

src : Görüntülenecek resmin konumunu belirtmek için kullanılır.

href : Bağlantı linkinin adresini yazmak için kullanılır.

target : Bağlantıya tıklandığında yeni sayfanın nasıl açılacağını belirtmek için kullanılır.Değer olarak _blank yazılırsa bağlantı, sizin sayfanız kapanmadan yeni bir sayfada açılır; _self yazılırsa sizin sayfanız kapanır ve linkin bağlanıdğı sayfa görüntülenir.

title : Linkeleri verirken kullanılır. Ziyaretçi fare ile link üzerine geldiğinde açıklayıcı mesajlar görüntülenmesini sağlar.

alt : Web sayfasına resim eklerken kullanılır. Ziyaretçinin web browser'ı (Internet Explorer, Firefox, Chrome artık her ne ise) resmi gösteremediği zaman resme alternatif bir metnin görüntülenmesini sağlar. Ayrıca buraya yazılan yazılar arama motorları tarafından indexlendiğinden "alt" parametresini kullanmanız sitenizin bulunabilirliğini arttıracaktır.

Bu şekilde resimleri düğmelere(buttonlara) çevirmiş oluyoruz...

Web Sayfasına Liste Eklemek

Web sayfamda içeriğimi başlıklar halinde görüntülemek istiyorum nasıl yapabilirim? Sitemde içindekiler bölümü oluşturmak istiyorum nasıl yaparım? HTML sayfasında listeleme nasıl yapılır? HTML bir insan olsaydı tüm bu sorulara şu cevabı verirdi:

< ol > < /ol > ve < ul > < /ul > taglarını kullan!!

Peki < ol > ve < ul > tagları ne manaya gelir? Nasıl kullanılır diye sorduğunuzu duyar gibiyim. Lafı uzatmadan açıklayayım da siz de kurtulun ben de!!

< ol > : Ordinary list "sıralı liste" demektir. Tercih ettiğiniz tipe göre liste elemanları 1,2,3 veya a,b,c veya i, ii, iii şeklinde işaretlenerek sıralanırlar.

< ul > : Unordinary list "sırasız liste" demektir. Tercih ettiğniz tipe göre liste elemanları disk, çember ya da kare şeklinde işaretlenerek sıralanırlar.

Her iki liste türünde de sılamak istediğimiz elemanları < li > < /li > taglarının arasına yazarız. Şimdi sıralı liste nasıl yapılır gösterelim:

< ol type="a" >
< li > Birinci Eleman< /li >
< li >İkinci Eleman< /li >
< li >Üçünncü Eleman< /li >
< li >Dördüncü Eleman< /li >
< /ol >

Burada type parametresine a, 1, i, I, A şeklinde değerler verilebilir. Çeşitli Durumlar için listeleme stillerini aşağıda tablo şeklinde gösterdim.

type="a" için;type="1" için;
  1. Birinci Eleman
  2. İkinci Eleman
  3. Üçünncü Eleman
  4. Dördüncü Eleman
  1. Birinci Eleman
  2. İkinci Eleman
  3. Üçünncü Eleman
  4. Dördüncü Eleman
type="i" için; type="I" için;
  1. Birinci Eleman
  2. İkinci Eleman
  3. Üçünncü Eleman
  4. Dördüncü Eleman
  1. Birinci Eleman
  2. İkinci Eleman
  3. Üçünncü Eleman
  4. Dördüncü Eleman

< ul > yani sırasız listenin kullanımı da diğeri gibidir burdaki tek fark type parametresine circle, disc ve square değerlerinin yazılmasıdır. Bu tagın genel yazımını ve kullanııclara sunduğu listeleme stil seçeneklerini aşağıda sıraladım:

< ul >
< li >Birinci Eleman < /li >
< li >İkinci Eleman < /li >
< li >Üçünncü Eleman < /li >
< li >Dördüncü Eleman < /li >
< /ul >

ul_liste

Liste elemanlarının görünümü tarayıcıdan tarayıcıya değişim gösterebilir. Ayrıca kullandığınız metin editörü de bunu etkileyebilir. Mesela ben Blogger'ın editörünü kullanıyorum ve bu editör sırasız listelerde sadece "disc" stiline izin verdiği için diğer stilleri bir resim dosyası olarak göstermek zorunda kaldım. Liste konusu sadece burda yazdıklarımla sınırlı değil. Ayrıca CSS ve javascript kullanarak liste elemanlarının görünümünü büyük ölçüde değiştirebilirsiniz. CSS ve Javascript kullanarak listelerden açılır menüler tasarlanmakta. İsteyenler internette bununla ilgili pek çok kaynak bulabilir. Yakında ben de listelerden menü yapımı ile ilgili bir yazı yazmayı planlıyorum. Şimdilik hepsi bu kadar. Hepinize kolay gelsin.

English Version

19 Mayıs 2011 Perşembe

Web Sayfasına Checkbox (Onay Kutucuğu) Koymak

İnternette gezinirken, girdiğiniz web sayfalarının özellikle kullanıcı kayıt formu bölümlerinde; ilgi alanlarınız başlığı altında, ziyaretçilerin eğilimleri ile ilgili hızlı veri toplamaya yarayan onay kutucuklarına rastlamışsınızdır. Bu bölümlerde ziyaretçilere müzik, sinema, gezi, teknoloji gibi sıralı seçenekler sunulur ve ziyaretçi bu seçeneklerin başında bulunan küçük kutucuklara tik işareti koyarak onaylar. Seçilen kutucuklar sitenin sunucusuna bir takım değerler gönderirler ve bu değerler işlenerek veri tabanına kaydedilir. İşte bu bilgileri toplamakla görevli küçük form elemanına "checkbox" onay kutucuğu adı verilir. Web sayfasına checkbox eklemek için HTML sayfasına < input type="checkbox" / > tagını uygun bir yere eklemeniz yeterlidir. Bu tagın görevini yerine getirebilmesi için gerekli birtakım parametrelerin tag içine yazılması gerekir. Bu kadar açıklamadan sonra şimdi de tagımızın nasıl kullanıldığını gösterelim;

< input type="checkbox" name="box1" checked="checked" value="secim1" title="Seç Birini" /> Birinci Seçenek < br/>
< input type="checkbox" name="box2" />İkinci Seçenek < br />
< input type="checkbox" name="box3" />Üçüncü Seçenek < br />
< input type="checkbox" name="box4" /> Dördüncü Seçenek < br />

Birinci Seçenek

İkinci Seçenek

Üçüncü Seçenek

Dördüncü Seçenek


Şimdi de tag içindeki turuncu ile işaretlenmiş olan parametreleri açıklayalım;

name : Onay kutucuğunu isimlendirmek için kullanılır. Web sayfasında birden fazla konuda onay kutucukları kullanılmış olabilir. Bu durumda ziyaretçiden gelen onay verisinin ne ile ilgili olduğunun sunucudaki bilgisayara belirtilmesi ve işlemlerde olası karmaşanın önlenmesi için checkbox'un mutlaka isimlendirilmesi gerekir.

checked : Bazı durumlarda onaylanmış olması şart olan seçeneklerin otomatik olarak onaylı görünmesi için kullanılır.

value : Onay kutucuğunun işlenmek üzere sunucuya göndereceği değeri belirtir.

title : Ziyaretçi fareyi onay kutucuğunun üstüne getirdiğinde beliren bilgilendirme mesajı için kullanılır.

Web Sayfasına Yazı Alanı Eklemek

Web sitenizi ziyaret edenlerin görüş ve önerilerini yazabilecekleri yazı alanları oluşturmak için < textarea > < /texarea > tagını kullanmalısınız. bu tag kullanıldığı yerde bir yazı alanı oluşturur. Bu tagın genel kullanımı şu şekildedir;

< textarea cols="15" rows="15" style=" float: left; font-size:16px; font:'Arial Black'; background: #333; color:#09F; text-shadow: 0.1em 0.1em 0.5em #FFF" > Yazı Alanı< /textarea >

< textarea > tagının içinde kullandığımız parametreleri açıklayalım;

cols : Yazı alanının genişliğini yani bir satırda kullanılabilecek max karakter sayısını belirlemek için kullanılır.

rows : Yazı alanının yüksekliğini (bir kerede görüntülenecek satır sayısını) belirlemek için kullanılır.

style : Pek çok HTML tagının içinde kullandığımız bu parametreyi burada yazı alanını biçimlendirmek için kullandık. Yazı alanına arkaplan rengi, yazı karakteri, harf puntosu ve yazıların altına gölge, ışıltı (text-shadow efekti internet explorer6 da görüntülenmez) gibi görsel özellikler ekledik.

14 Mayıs 2011 Cumartesi

Web Sayfasında "iframe" Kullanmak

< iframe > tagı web sitelerinde sayfaya dahili bir html sayfası yerleştimek için kullanılır. Bu tagı koyduğunuz yerde bir kutucuk belirir ve bu kutucuk içinde adres olarak belirttiğiniz html sayfası görüntülenir. Web sitelerinde sıklıkla görmüş olduğunuz içinde kayan yazıların olduğu (genelde "Duyurular" başlığı altında yayınlanan hareketli yazılar için kullanılır) kutular iframe ile yapılır. Bu tagın genel kullanımı şu şekildedir,

< iframe src="deneme.html" width ="400" height="550" scrolling="no" frameborder="1" name="deneme" id="deneme" > < /iframe >

Şimdi "iframe" içinde kullanılan parametreleri açıklayalım;

iframe
src : Görüntülenmek istenen html sayfasının adresini belirtmek için kullanılır. Yeri gelmişken söyleyeyim; adres kısmına ille de html sayfası koymak zorunda değilsiniz. İsterseniz bir video ya da resim dosyasının adresini de verebilirsiniz. Browser'ınız o dosyaları da görüntüleyecektir.

width : Kutucuğun genişliğini belirlemek için kullanılır.

height : Kutucuğun yüksekliğini belirlemek için kullanılır.

scrolling : Kutucuk kenarına sürükleme çubuğu eklemek için kullanılır. Scrollbar'ı göstermek için "yes" gizlemek için "no" yazılır.

frameborder : Kutucuğa kenarlık eklemek için kullanılır. "0" ve "1" değerlerini alabilir.

name : Kutucuğu isimlendirmek için kullanılır. Web sayfasına koyduğunuz bir link'in tıklandığında aynı kutucuk içinde görüntülenmesini istiyorsanız, linkin "target" parametresine "iframe" için atadığınız ismi yazın. Sayfanın kutucuk içinde açıldığını göreceksiniz.

id : Kutucuğu CSS ile biçimlendirmek için kullanılır.

Benim iframe ile ilgili bildiklerim bu kadar... Sadece html görüntülemek zorunda değilsiniz demiştim. İsterseniz video da görüntüleyebilirsiniz. İşte size bunu çok güzel bir örneği;

< iframe width="320" height="240" src="http://www.youtube.com/embed/JOddp-nlNvQ" frameborder="0" allowfullscreen > < /iframe >

Bu kodu web sayfanıza ekleyerek Thor filminin fragmanını ziyaretçilerinize izletebilirsiniz. Gördüğünüz gibi iframe son derecede kullanışlı bir tag (kod ya da etiket siz ne derseniz deyin). Bu tagı kullanarak çok güzel tasarımlar yapabilirsiniz. Ziyaretçilerinizin sitede hoşça vakit geçirmesini sağlayabilirsiniz. Hepinize kolay gelsin.  Şimdilik hoşçakalın...

13 Mayıs 2011 Cuma

HTML Kodları ile Web Sayfasına Müzik ve Video Eklemek

Binbir uğraşıyla, özene bezene bir web sayfası hazırladınız ve bu sayfada, ziyaretçiler dolaşırken bir fon müziği çalsın istiyorsunuz. İşte bu durmda HTML'nin < embed > kodu imdadınıza yetişiyor. Bu tagı kullanarak videoları sayfanızda görüntüleyebilir, mp3, waw, wma uzantılı müzik dosyalarını web sayfanıza fon müziği olarak kullanabilirsiniz. Peki ama bu tag nasıl kullanılır? Lafı fazla uzatmadan bu tagın ya da kodun nasıl kullanılacağını bir örnek üzerinde gösterelim,
< embed src="müzik dosyası.mp3" hidden="true" autostart="true" loop="true" >

Şimdi bu tagın içinde geçen parametreleri kısaca anlatalım:

infial_html
src : Film ya da müzik dosyasının konumunu (adresini) belirtmek için kullanılır.

hidden : Mediaplayer eklentisinin görünürlüğünü değiştirmek için kullanılır. true yaparsanız eklenti görünmez false yaparsanız görünür.

autostart : True değerini verirseniz müzik dosyası sayfa yüklenir yüklenmez otomatik olarak çalmaya başlar.

loop : Müziğin kaç kez çalınacağını belirtmek için kullanılır. -1 ya da true değerini verirseniz sürekli çalar. false derseniz bir kez çalar ve durur.

NOT: Eğer amacınız sadece fon müziği koymak isre hidden parametresini true yaparsınız ve bu tagı olduğu gibi < head > < / head > arasına yazarsınız böylece sayfada yer işgal etmemiş olur.
Web Sayfasına Video Eklemek

< embed > tagı web sayfasına video eklemek için de kullanılabilir. Bununla ilgili örnek kodlama şu şekildedir;

< embed src="http://www.youtube.com/v/hY-vXcmpZIw?version=3&hl=en_US&rel=0" width="425" height="349" >

"width" ve "height" parametreleri videonun boyutlandırılması için kullanılır. Burada verdiğim örnek kodu Lady Gaga'nın Poker Face isimli parçasını bloğuma eklemek için kullandım. Keyfini çıkarın !!! :))


8 Mayıs 2011 Pazar

HTML Kodları ile Web Sayfasına Resim Eklemek

Web sayfanızın ziyaretçilerine güzel görünmesi ve site içeriğinin zenginleştirilmesi için, anlatılan konu ile ilgili ya da dekoratif amaçlı resimler mutlaka kullanılmaldır. Genelde web sitelerinde gif, jpeg ve png uzantılı resimler kullanılır.

Web sayfasına resim yerleştirmek için < img > tagı kullanılır. Bu tagın diğer HTML kodları gibi < img ></ img > şeklinde kapatılmasına gerek yoktur. Bu tagın genel kullanımı şöyledir:

< img src="örnekresim.jpg" >

"src" kodu sayfaya ekleyeceğimiz resim dosyasının konumunu, dosyanın nereden ekleneceğini belirtmek için kullanılır. Burada eklenmek istenen resmin konumunun doğru yazıldığından emin olunmalıdır. Aksi takdirde resim görüntülenemez. Konum olarak "src" kodunu başka bir web sayfasındaki resmi eklemek için de kullanabilirsiniz src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivNTPojmcy7JFv_jqsujs-w6BFtZUhL9L3_SWCW4gZZEGqEf_-17TPtaa4p-kuuMmboSTmKeE2SKun4wpXtrcqVo-1TsWiO-7So77B2l2id1LKhjFtYYDbRB9SQ8x3_dej27XB4mNLRKZS/s200/sistine_1600x1200.jpg" bu şeklinde host için ayırdığınız yerden de tasarruf etmiş olursunuz.

Şimdi bu tagı bir örnek üzerinde açıklayalım;

< img border="0" height="150" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNB_sc1YMWh1LVL0Z5RTq6UQGXZMEEM8UpWX1uIIW8bEQ3chmRt-ZplryNF8YAThRC18hOOnh0shdqYs32iMiOFeGbqbrRj8Ybj_r8znXzif8N6owIoPvDdgFPNNueV0RrwmZ-b_pXv6Q/s200/sistine_1280x960.jpg" alt="Sistine" title="Sistine" >

Bu kodlamanın sonucu aşağıdaki gibi görüntülenir,


Sistine

Görüldüğü gibi < img > tagının içinde "src" ile birlikte kullanılan birkaç tane parametre bulunmaktadır. Bunları da açıklayalım,

alt : Resim yerine kullanabileceğiniz alternatif metindir. Genelde resim yükelenemediği zaman ziyaretçilere bilgi vermek için kullanılır. Resme verdiğiniz özel bir isim varsa (bu sattığınız bir ürünün adı olabilir) buraya yazabilirsiniz. alt parametresi arama motorları tarafından kaydedilir. ve sitenizin erişilebilirliğini arttırır.

border : Resme eklemek istediğiniz kenarlığın kalınlığını belirtir.

width : Resmin genişliğini belirlemek için kullanılır.

height : Resmin yüksekliğini belirlemek için kullanılır.

title : Buraya yazdığınız metin ziyaretçi mouse ile resim üzerine geldiğinde görüntülenir.

10 Eylül 2010 Cuma

HTML KODU İLE WEB SAYFASINA DİKEY ÇİZGİ ÇİZMEK






Dikey çizgi çizmek web sayfası tasarlarken karşılaşılan zorluklardan biridir. HTML sadece <hr> tagı ile yatay çizgi çizme imkanı sunar; dikey çizgi tagı yoktur. Dikey çizgi çizebilmek için biraz uğraşmak gerekmektedir. Bu yazıda HTML ve CSS kodları yardımıyla dikey çizgi çizebilmek için <div>tagını kullanarak uygulayabileceğiniz iki yöntemden bahsetmek istiyorum.


1. <div> tagının "border" özelliğini kullanmak

Yan yana dizilen divlerden bir tanesine kenarlık eklenerek dikey çizgi elde edebilir. Bununla ilgili örnek kodlama:

<div id="taban" style= border: solid 2px #cccccc; width:452px; height:auto; float:left;">
<div id="Soltaraf" style="width:225px; height:auto; border-right: 2px solid #FFFFFF; float:left; background-color: #999;">
Sol Taraf<br />
İcerik 1<br />
İcerik 1<br />
İcerik 1<br />
İcerik 1<br />
İcerik 1<br />
İcerik 1<br />
</div>
<div id="Sagtaraf" style="width:225px; height:auto; float:left; background-color: #CC9;">
Sağ Taraf<br />
İcerik 2<br />
İcerik 2<br />
İcerik 2<br />
İcerik 2<br />
İcerik 2<br />
İcerik 2<br />
</div>
</div>

Burada 3 tane div kullandım. Tüm divleri barındıran "taban" ve onun içeriğini oluşturan "Soltaraf" ile "Sagtaraf" divleri. "Soltaraf" divine border-right: 2px solid #FFFFFF; kodu ile sağdan 2px kalınlığında bir çerçeve elemanı ekledim. Böylece "Soltaraf" ile "Sagtaraf" arasında 2px kalınlığında beyaz bir sınır çizgisi elde ettim. Aynı şey "Sagtaraf" divinin sol çerçevesine uygulayarak da yapılabilir. Bunun içn "Sagtaraf" divinde "style" içine border-left:2px solid #FFFFFF; kodunu eklemek yeterli olacaktır. Bu kodlamanın sonucu aşağıdaki gibidir:




2.Ayrıca bir <div> tagı koyarak sınır çizgisi olşturmak

Tasarladığınız web sayfasında <div> tagını dikey çizgi elde etmek için kullanabilirsiniz.Böyle bir uygulama için örnek kodlama:

<div id="taban" style="background-color: #000; border: 2px solid #FF0; height:140px; width:450px;">
<div id="Soltaraf" style="float:left; height:140px; width:224px; background-color: #CCC;">
Sol Taraf <br />
İçerik 1<br />
İçerik 1 <br />
İçerik 1 <br />
İçerik 1 <br />
İçerik 1 <br />
İçerik 1 <br />
</div>
<div id="Dikeycizgi" style="width:2px; height: 140px; float:left; background-color: #FF0000; "></div>
<div id="Sagtaraf" style="background-color: #0FF; float: right; height: 140px; width: 224px;">
Sağ Taraf <br />
İçerik 2 <br />
İçerik 2 <br />
İçerik 2 <br />
İçerik 2 <br />
İçerik 2 <br />
İçerik 2 <br />
</div>
</div>


Bu seferki sistemde dört eleman bulunmakta. İlk seferdekilere ek olarak "Dikeycizgi" adında bir div elemanı ekledim. Bu eleman "Soltaraf" ile "Sagtaraf" divlerinin ortasında durmakta ve bir sınır çizgisi; "Dikey Çizgi" görevi görmektedir. 2px kalınlığında ve kırmızı renkte ve tam bir sınır çizigisi oluşturabilmesi için diğer divlerle aynı boydadır. Bu kodlamanın sonucu da aşağıdaki gibidir:



Bu ve benzeri kodlamaları yaparken elemanlara ait kenarlık ve çerçeve kalınlıkları, varsa eklenen margin, padding değerleri de hesaba katılmalı, web sayfasını oluşturan bileşenlerin boyutlandırılması ona göre yapılmalıdır.

25 Ocak 2010 Pazartesi

Açılır Menü (Dropdown Menu)

Açılır Menü (Dropdown Menu):
Web sitelerinde sıkça kullanılan menü çeşididir. Kullanıcılara seçebilmeleri için çeşitli seçenekler sunar. Özellikle üye kaydı için hazırlanan form sayfalarında, doğum tarihi, eğitim durumu ve adres bilgileri gibi önemli bilgilerin önceden belirlenen bir standart ile toplanmasını sağlar, kullanıcıların yazım şekillerinden kaynaklanan karmaşayı önler. Bu ön bilgilerin ardından lafı daha fazla uzatmadan bu işin nasıl yapıldığına geçelim.

Web sitesine Açılır menü eklemek için "<>" tagı kullanılır. Kullanıcıdan seçmesi istenen seçenekler "<>" arasına yazılır. Bu tagın genel kullanımı şu şekildedir:

"< name="secenekler" size="1">
< value="secenek1"> Seçenek1< value=" Seçenek 2"> Seçenek 2
< value=" Seçenek 3"> Seçenek 3< value=" Seçenek 4"> Seçenek 4
< value=" Seçenek 5"> Seçenek 5< value=" Seçenek 6"> Seçenek 6
< value=" Seçenek 7"> Seçenek 7< value=" Seçenek 8"> Seçenek 8
< value=" Seçenek 9"> Seçenek 9< value=" Seçenek 10"> Seçenek 10
< value=" Seçenek 11"> Seçenek 11< value=" Seçenek 12"> Seçenek 12"

Buradaki name="secenekler" ile kullanıcının seçtiği seçenek “secenekler” isminde bir değişkene atanır ve form bilgilerinin kullanıldığı PHP veya ASP dosyasına veri girdisi olarak gönderilir. size="1" ile Açılır menüdeki satır sayısı belirlenir. Yukarıdaki kodların web sayfasındaki görünümü şöyledir:

12 Haziran 2009 Cuma

HTML KODLARI İLE YATAY ÇİZGİ ÇİZMEK






WEB SAYFASINA YATAY ÇİZGİLER EKLEMEK İÇİN:
&LT HR&GT TAGI KULLANILIR
BU TAG İÇİNDE KULLANILAN BAZI KODLAR YARDIMI İLE ÇİZMEK
İSTEDİĞİMİZ ÇİZGİNİN ÖZELLİKLERİNİ DE BELİRLER.
İŞTE BU TAG İÇİNDE KULLANILAN KODLAR:



WIDTH__:&nbsp ÇİZGİNİN YATAY UZUNLUĞUNU BELİRLER




SIZE__:&nbsp&nbsp ÇİZGİNİN KALINLIĞINI BELİRLER




COLOR__:&nbsp ÇİZGİ RENGİ BELİRLENİR



BU KODLAR ŞU ŞEKİLDE KULLANILIR:

&LT hr width=”100%” color=”#0000F8” size=5&GT

YAZDIĞIMIZDA WEB SAYFAMIZDA BELİREN ÇİZGİ ŞU ŞEKİLDEDİR:



ÇİZGİ GENİŞLİĞİNİ BİR DEĞER OLARAK YA DA SAYFA GENİŞLİĞİNE GÖRE

YÜZDELİK ORANDA BELİRLEYEBİLİRİZ. KALINLIK İSE 1-100 ARASI DEĞERLER ALIR.

BURADA AYRICA BELİRTELİM BU TAG'IN &LT/hr&GT ŞEKLİNDE KAPATILMASI GEREKMEZ






ŞİMDİLİK SADECE YATAY ÇİZGİYİ ANLATTIK DİKEY ÇİZGİ NASIL ÇİZİLİR? NASIL KONUMLANDIRILIR?

İŞTE CEVABI HTML KODU İLE WEB SAYFASINA DİKEY ÇİZGİ ÇİZMEK

7 Haziran 2009 Pazar

HTML'DE TABLO YAPMAK


WEB SAYFASINA TABLO EKLEMEK İSTERSEK
KULLANMAMIZ GEREKEN HTML TAGI
<TABLE></TABLE>
İŞTE BU TAG İLE BİRLİKTE KULLANILAN KODLAR
KODİŞLEVİ
BORDER="DEĞER"TABLONUN KENARLIK KALINLIĞINI BELİRLER
WIDTH="DEĞER"TABLONUN GENİŞLİĞİNİ BELİRLER
HEIGHT="DEĞER"TABLONUN YÜKSEKLİĞİNİ BELİRLER
CELLPADDING="DEĞER"HÜCRELERDEKİ ÖĞELERİN TABLO KENARLARINA UZAKLIĞINI BELİRLER
CELLSPACING="DEĞER"HÜCRELERİN BİRBİRİNE OLAN UZAKLIĞINI BELİRLER
BGCOLOR="RENK"TABLONUN ZEMİN RENGİNİ BELİRLER


HEMEN BASİT BİR ÖRNEK İLE OLAYI AÇIKLAYALIM
HTML'DE KULLANILAN RENK KODLARI İLE İLGİLİ BİR TABLO YAPMAK İSTERSEK KODLAMA ŞU ŞEKİLDE OLACAKTIR:

< TABLE BORDER="1" CELLSPACING="1" CELLPADDING="1" BGCOLOR="AA99CC" WIDTH="85%" >
< TR>< TD BGCOLOR="FFFFFF"> RENKLER < /TD > < TD > < /TD > < TD BGCOLOR="FF0000"> KIRMIZI < /TD > < TD BGCOLOR="00FF00">YEŞİL < /TD > < TD BGCOLOR="0000FF">MAVİ< /TD > < /TR >
< TR > < TD BGCOLOR="FFFFFF"> KODLAR< /TD > < TD ># < /TD > < TD & GT 0,1,2..A,B,..F < /TD > < TD > 0,1,2..A,B,..F < /TD > < TD > 0,1,2..A,B,..F < /TD > < /TR >
< /TABLE >
BU KODLARIN WEB SAYFANIZDAKİ GÖRÜNÜMÜ ŞÖYLEDİR:
RENKLERKIRMIZIYEŞİLMAVİ
KODLAR#0,1,2..A,B,..F0,1,2..A,B,..F0,1,2..A,B,..F
BURADA AÇIKLAMAMIZ GEREKEN İKİ TAG DAHA VAR!
İLKİ:
< TD > < /TD >
BU TAG TABLO İÇİNDE YAN YANA HÜCRELER OLUŞTURMANIZI SAĞLAR. <TD>BİRİNCİ HÜCRE< /TD > < TD > İKİNCİ HÜCRE< /TD > GİBİ..
İKİNCİSİ İSE:
< TR > < /TR >
BU TAG DA TABlONUZA SATIRLAR EKLEMEK İÇİN KULLANILIR.
< TR > < TD > BİRİNCİ HÜCRE< /TD > < TD > İKİNCİ HÜCRE< /TD > < /TR > İLK SATIR
< TR > < TD > ÜÇÜNCÜ HÜCRE < /TD > < TD > DÖRDÜNCÜ HÜCRE< /TD > < /TR > İKİNCİ SATIR
NOT: ONALTILIK RENK KODLARINI GİRMEK İÇİN "...."ARASINA YAZMAK YERİNE KODLARIN BAŞINA # İŞARETİ KONULABİLİR. AYRICA RENKLERİN İNGİLİZCE ADLARINI DA YAZABİLİRSİNİZ...

4 Haziran 2009 Perşembe

HTML KODU İLE KAYAN YAZI EFEKTİ VERMEK

WEB SAYFANDA HAREKETLİ YAZILAR GÖRMEK İSTİYORSAN İŞTE SANA GÜZEL, KUILLANIŞLI BİR HTML KODU (YA DA TAGI)..

< marquee > < /marquee >
HAREKET ETTİRMEK İSTEDİĞİN METNİ BU İKİ TAGIN ARASINA YAZIYORSUN VE WEB SAYFANA EKLİYORSUN. HAREKET DEMİŞKEN HEMEN HATIRLATALIM SAYFAYI ZİYARET EDENLER AŞIRI HAREKETLİ NESNELERDEN RAHATSIZ OLABİLİRLER. BUNDAN DOLAYI BU TAGI KULLANIRKEN ÇOK DA AŞIRIYA KAÇILMAMASI ÖNERİLİR.BU TAGI ÖYLE KURU KURUYA KULLANMIYORSUN, KENDİNCE BİR TAKIM AYARLARI VAR.YAZILAR NASIL HAREKET EDECEK? NE YÖNDE GİDECEK? ARKA PLAN RENGİ NE OLACAK? GİBİ SORULARIN CEVAPLANMASI LAZIM.İŞTE BU SORULARIN CEVABI:
LOOP="TEKRAR SAYISI"_________HAREKETİN TEKRARLANMA SAYISINI BELİRLEMEK İÇİNKULLANILIR -1 DEĞERİ VERİLİRSE HAREKET SÜREKLİ OLUR.
BEHAVIOR=""__________________YAZININ HAREKET ŞEKLİNİ BELİRLER. BEHAVIOR="ALTERNETE" YAZILIRSA,YAZI BELİRLENEN ALAN İÇİNDE SAĞ-SOL HAREKETİ YAPAR, KOD KULLANILMAZSA YAZI SAYFANIN BİR UCUNDAN GİRİP DİĞERİNDEN ÇIKAR.
BGCOLOR="RENK"________________YAZININ FON RENGİNİ BELİRLER
SCROLLAMOUNT="YAZININ HIZI"___GİRİLEN SAYI DEĞERİNE GÖRE YAZININ HAREKET HIZI DEĞİŞİR
WIDTH="GENİŞLİK"______________GİRİLEN SAYI DEĞERİNE GÖRE YAZININ HAREKET EDECEĞİ BÖLGENİN GENİŞLİĞİ BELİRLENİR.
HEIGHT="YÜKSEKLİK"____________GİRİLEN SAYI DEĞERİNE GÖRE YAZI ALANININ YÜKSEKLİGİ BELİRLENİR.
ŞİMDİ BU BİLGİLER IŞIĞINDA BİR İKİ KAYAN YAZI DENEMESİ YAPALIMM

<marquee scrollamount="10" behavior="alternate" width="200" bgcolor="#EE0000" height="45" > < H4 > < B > DENEME 1 < /B > < /H4 > < /marquee >

DENEME1 YAZISI BELİRLENEN ÖLÇÜLERDEKİ ALAN İÇİNDE SAĞ-SOL HAREKETİ YAPAR.

DENEME 1



< marquee scrollamount="4" loop="15" width="200" bgcolor="##00EE00" height="75"> < H4 > < B > DENEME 2 < /B > < H4 > < /marquee >


DENEME 2 YAZISI KENDİSİ İÇİN BELİRLENEN ALANIN SAĞINDAN DAHA DÜŞÜK BİR HIZLA HAREKETİNE BAŞLAYACAK VE SOLUNDAN DIŞARI ÇIKACAK BU HAREKETİNİ 15 DEFA TEKRARLAYIP DURACAK

DENEME 2