|
|
|
|
|
|
|
|
KARIŞIK HTML KODLARI
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
KONU AYIRAÇLARI
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
YAZILI İMZALAR
|
|
|
|
|
|
|
|
|
|
MENÜ KODLARI
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| |
| Form
Yapalım...-1 | |
Sitemiz de ziyaretçi defteri olsun istiyoruz..
Ya da ziyaretçimizin doldurması için form alanı oluşturmamız lazım..
Şimdi
de Form alanı oluşturmak için gereli araç ve gereçleri öğrenelim:) |
| Form alanı nelerden
oluşur? | | Okul da ya da günlük yaşantınızda eminim ki form
doldurdunuz.. Hayatınıza internet geldi ve formlarla daha çok karşılaşmaya başladınız..
Gezdiğiniz sitelerde gördüğünüz ziyaretçi defterlerinin artık kendi sitenizde
olmasını istiyorsunuz..
Ancakk Ziyaretçi Defterimizin sayfasını oluşturabiliriz
ama Ziyaretçi Defterimizin işleyebilmesi için CGI denen programlama dilini bilmemiz
gerekir.. Biz şimdilik sadece form alanı oluşturmak ile yetineceğiz.. İleri de
belki Ziyaretçi Defterinin işleyişinden de söz edebiliriz :-) Bu kısa ziyaretçi defteri kursundan sonra gelelim
form alanı oluşturmaya: | | Form'u yapı taşları |
| Sayfamızda bulunan form, isteğe bağlı olarak değişik
text alanlarından oluşabilir.. Ya da aşağı doğru açılan bir menü ile ziyaretçinin
isteğini seçmesine izin verebiliriz.. Şimdi tek tek forum'u oluşturan temel yapı
taşlarından söz edelim.. Bir de bunları örnekler ile gösterelim.. Sıvayın kolları
Form Alanı yapıyoruz! | | |
| | Form alanı:
| | Text
Area (metin alanı): | | Form alanının dışında da kullanılabilen text area
yani metin alanı, isminden de anlaşıldığı gibi içine yazı yazabileceğimiz bir
alandır.. |
| Şimdi
bir örnek: <form><textarea
rows="5" cols="20">Yazınızı buraya yazın!</textarea><form> |
| Yukarıda
örneğini verdiğimiz metin alanı Form alanının bir parçasıdır.. Form alanı <form>
ile başlar </form> ile biter.. Tekrar yukarıdaki örneğimize bakar isek <textarea>
ile başlayan </textarea> ile biten metin alanı oluşturma etiketlerini görüyoruz..
textarea etiketinin yanına yazdığımız "rows" alanımızın yüksekliğini, "cols" ise
genişliğini belirlememize yarar.. Böylece metin alanımızın boyutlarını da ayarlıyabiliriz.. |
| Renkli Metin
alanı yapalım: | |
<form><textarea
rows="5" cols="20" style="background:#ff33ff" style="font-family:Verdana" style="color:#ffccff"
"style="border style:solid;" >Buraya yazınızı yazın!</textarea></form>
| | Yukarıda örneğimiz ve örneğimizin altında da kaynak
kodunu görüyoruz.. Bu seferki kaynak kodumuz diğerinden biraz daha uzun. Bu kodlara
biraz daha yakından bakalım:
Tekrar <form> etiketi ile başlıyan </form>
etiketi ile biten, alanımızın form' a ait olduğunu belirten kodlarımızı yazdıktan
sonra, alanımızın metin alanı olduğunu belirten <textarea; etiketimizi yazdık.
Yükseklik (rows) ve genişliği (cols) belirttik. Daha sonra, metin alanımızın zemin
rengini belirten
style="background:#ff33ff"
etiketini tekrar <textarea> etiketimizin
içine yazdık.. Aynı yere bu sefer yazı tipimizi ve rengini belirlemeye yarayan
style="font-family:Verdana" style="color:#ffccff"
"style="border style:solid;"
etiketimizi yazdık..
Sonuç: Şeker gibi bir metin alanımız oldu:) |
| Dikkat!
Örneklerimiz de sözünü ettiğimiz "style" etiketlerini daha sonra ayrıntılı şekilde
göreceğiz.. Şimdi kafanızı karıştırmasını istemem...
Bir de umarım renk kodlamalarını
hatırladınız! Eğer hatırlamadı iseniz diğer derslerimize bir göz gezdirin!
Bu açıklamadan sonra devam edelim:) |
| | Metin alanımıza
arka plan resmi ekleyelim: | |
<form><textarea
rows="5" cols="26" style="background-image: url('kablumbik.gif')" style="font-family:comic
sans ms" style="color:#9900ff" style="border style:solid" >Yazınızı buraya
yazın!</textarea></form> |
| Bu
seferki metin alanımızın zeminin de resimler var.. Bunu daha önceki derslerimizde
de gördüğümüz "background" etiketi ile yaptık.. Normal "form" ve "textarea" etiketilerimizin
yanına bu sefer:
style="background-image: url('kablumbik.gif')"
Etiketini ekledik. Böylece metin alanımızın arka planı resim ile doldu..
Ben elimde olan kaplumbikleri kullandım.. Siz de kendi zevkinize göre istediğiniz
resmi kullanabilirsiniz.. | |
Şimdilik form unsurlarından en dikkat çekeni olan
Metin
Alanı ' nın nasıl yapıldığını öğrendik.. Form alanımızı oluşturan bütün unsurları
oluşturduktan sonra hepsini bir araya getirip bir form oluşturacağız.. Ama biraz
sabredin.. Ve unutmayın hiçkimse mükemmel değildir... |
| |
| |
|
|
|
|
|
|
|
|
|
|
|
|
|
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
TOPLİSTLER
