Sınır Çizgi Şekilleri
CSSde sınır çizgilerinin şeklini belirlemek için border-style
özelliğinden yararlanırız. Bu özelliğin değerleri şunlardır: none,
dotted, dashed, solid, double, groove, ridge, inset, ve outset.
Aşağıdaki uygulama bu değerlerin nasıl sonuç verdiğini gösteriyor. NOT:
Bu özelliği Netscape desteklemiyor.
Kod Alanı: |
HTMLde nesnelerin diğer nesnelere olan konumunu, dışkenar boşlukları ile belirleyebiliriz. Her nesnenin bir sınır çizgisi olduğu gibi, sınır çizgisinin dışında bir boşluk da vardır; ancak bu boşluğun varsayılan değeri sıfırdır. Bu dersimizde bu boşluğu margin özelliği ile ifade edeceğiz.
Dışkenar Boşluk Değeri
margin özelliğine vereceğimiz değerler şu şekillerde olabilir:
auto Dışkenar boşluğunu gözatıcı (browser ) otomatik olarak belirler.
margin: auto
birim Dışkenar boşluğunun CSS birimleriyle ifade edilmesidir.
margin: 12px, margin:1cm, vb.
yüzde oranı Dışkenar boşluğunun, sayfa büyüklüğüne olan yüzde oranıyla belirlenmesidir.
margin: 20%
İçkenar Boşluk Değeri
Özellikle tablolarda içkenar boşluklarının ayarlanması, tablo düzeni için önemli bir işlemdir. CSSde dışkenar boşluklarını ifade etmek için padding özelliğinden yararlanırız.
padding özelliğine vereceğimiz değerler şu şekillerde olabilir:
birim İçkenar boşluğunun CSS birimleriyle ifade edilmesidir.
padding: 12px, margin:1cm, vb.
yüzde oranı İçkenar boşluğunun, sayfa büyüklüğüne olan yüzde oranıyla belirlenmesidir.
padding: 20%
Eğer padding özelliğine tek değer verirsek, tüm içkenar boşlukları bu değeri alır. Eğer iki değer verirsek, üst ve alt içkenar boşlukları ilk değeri, sol ve sağ içkenar boşlukları ikinci değeri alır. Eğer üç Bu sayfayı okumadan önce, HTMLde öğrendiğimiz listeleme kodlarını birkez gözden geçirmenizi tavsiye ederim. Bu sayfanın konusu listeleme kodlarını CSS ile şekillendirmektir.
Maddeleme İşaretleri
HTMLde anlatıldığı üzere, iki tür listeleme vardır: sıralı listeleme, sırasız listeleme. Sıralı listelemeyi type="..." parametresine "1", "a", "A", "I", "i" gibi değerler vererek şekillendiriyorduk. Aynı şekilde sırasız listelemeyi type="..." parametresine "disc", "circle", "square" gibi değerlerle şekillendiriyorduk. CSSde type="..." parametresinin işlevini list-style-type özelliği üstlenmiştir. Bu özelliğin aldığı özellikler de aşağı yukarı aynı:
none Maddelerin önüne işaret koymaz. Bu sayfada HTML nesnelerinin CSS ile sayfa içinde nasıl konumlandırılacağını göreceğiz.
Nesne Yüzdürme
İlk özelliğimiz: float. Bu özellik ile HTML nesnelerinin sayfada veya herhangi bir HTML elemanının içinde konumlandırmaya yarar. Bu işleme yüzdürme diyoruz. Örneğin bir resim nesnesinin metin içindeki konumunu düşünün, bu resim nesnesini hizalayarak bu nesneyi metin denizi içinde yüzdürmüş oluyoruz. Eğer float özelliğine right özelliği verirsek nesne sağda, left özelliği verirsek solda, none özelliğini verirsek yazıldığı yerde konumlandırılır.
Fare İmlecini Seçmek
Fare imlecinin sembolünü değiştirmek de sizin elinizde. Bunun için cursor özelliğini kullanıyoruz. cursor özelliği aşağıdaki değerleri alabilir:
url Bu değer ile kendi tasarladığımız .cur uzantılı imleci tanımlayabiliyoruz. --
default Varsayılan değer bildiğimiz ok şekli imleç. Değiştirdiğimiz imleçten varsayılan değere dönmek için sıkça kullanılır.
hand Genellikle link izlenimi veren el şekilli bu imleç, ziyaretçiyi sol tıklamaya güdüler.
crosshair Ziyaretçiyi bir noktayı belirlemesi (nişan alması ) yönünde güdüler.
pointer Ziyaretçiyi bir noktayı göstermeye güdüler.
move Ziyaretçiyi bir şeyi tutup hareket ettirmeye güdüler. Cssin (Stil Şablonu ) 3 farklı kullanım alanı vardır. Bunlar ;
Yerel, yani sayfada sadece bir kez: Yerel stil şablonlar bir html etiketi için özel olarak kullanılırlar.
Global, yani tüm sayfa için: Global stil şablonlar sayfadaki tüm html etiketlerinin belirlenen özellikte olması istendiğinde kullanılırlar.
Bağlantılı, yani birden çok sayfa için: Ba?lantılı stil şablonlar birçok sayfada aynı biçimde olması istendiğinde kullanılırlar.
Yerel Stil Şablonu
Yerel Stil Şablonlar, uygulanacak etiketi sadece bir kez bulunduğu yerde (yerel ) etkiler. Şimdi bir örnek verelim.
Scrollbarınızı renklendirmek istiyorsanız bu ders size çok yardımcı olacaktır.
Kod Alanı: |
body {
scrollbar-arrow-color: #547741;
scrollbar-face-color: #FFFFFF;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-darkshadow-color: #FFFFFF; Bu Dersimizde Bilgileri Yan Yana Sıralamayı Gorecegiz...
Kod Alanı: |
<%
Baslangic = 1
Bitis = 50
SiraSayisi = 2
%>
<table>
<tr><% for i = Baslangic to Bitis %>
<td> <%=i%></td> Diyelimki 1.asp den 2.asp ye veri yolladınız. 2.asp bunu kontrol edip 1. nolu sayfaya geri dönmek istesin.daha açık söylemek gerekirse geri dönceği sayfanın adının hiç bir önemi yok.Bu kod geldiği yere geri gönderir
Kod Alanı:
| Bu dersimizde QueryString komutunun nasıl kullanıldığını ve ne işe yaradığını anlatacağım.
QueryString
Query bildiğiniz gibi sözlük anlamı sorgu demektir.
Request.QueryString çağırdığın stringi sorgula demektir.
QueryString Get method unu kullanır.
Şimdi detaylara inip anlamanızı kolaylaştırayım.
internette sörf yaparken explorer de gezdiğiniz url ( adres ) lere bakarken
http://www.siteadi.com/defaukt.asp?isim=hakan&yas=25
gibi şeyle görüyorsunuzdur. işte bunlar String dediğimiz şeylerdir.
Play: Sahnemizin oynatılmasını sağlar.
Rewind: Sahnenin ilk frame’ine dönmeye yarar.
Step Forward: Adım adım ileriye götürür.
Step backward: Adım adım geriye götürür.
Test Movie: Fliminizi tüm sahneleriyle beraber test etmenizi sağlar.
Test Scene: Seçili sahneyi test etmenizi sağlar.
Loop Playback: İşletilen harekelerin hiç durmadan devam etmesini sağlar.
Play all Scenes: Bütün sahnelerin oynatılmasını sağlar.
Enable Frame Actions: Actionları aktifleştirir.
Enable buttons: Düğmeleri etkinleştirir.
Mute Sounds: Ses dosyalarını kapatır.
Convert To symbol: İşaretli olan symbol’den aynı özelliklere sahip başka bir symbol oluşturur.
New Symbol: Yeni buton, movie veya grafik yaratmak için kullanılır.
Layer: Yeni layer açmak için
Motion Guide: Motion Guide oluşturur.
Frame: Frame Oluşturur
Delete Frame: Seçili frame’i silmeye yarar.
Keyframe: Yeni keyframe oluşturur.
Blank Keyframe: Özel bir keyframe açar.
Clear Keyframe: Seçili keyframe’leri temizlemeye yarar.
Creat Motion Tween: Sahne üzerindeki objelere hareket vermek için kullanılır.
Scene: Yeni sahne oluşturur.
Undo: Yanlışlıkla yapılan işlemi geri almamıza yarar.
Redo: Yapılan işlemi bir ileri alma işlemine yarar.
Cut: İşaretlenmiş kısmı kesmeye yarar.
Copy: İşaretlenen kısmı kopyalamaya yarar.
Paste: Daha önceden copy veya cut işlemleri ile yapılmış işlemi yapıştırmaya yarar.
Paste in Place: Pano’nun içeriğini flash dosyanıza yapıştırır ve orijinal dosyaya bir bağlantı oluşturur.
Paste Special: İletişim kutusunda göreceğiniz seçenekler, panonun içeriğine göre farklılık gösterir.
Clear: Yapıştırılan belgeyi silmeye yarar.
Duplicate: İşaretlenmiş kısmın bir kopyasını yaratır.
Kod Alanı: | Insert > Media > Flash Button yönergesini izleyelim. Ekranda, işlem yapmadan önce sayfamızı kaydetmemiz gerektiğini belirten bir mesaj kutusu belirecektir.
Ok butonuna basalım ve belgemizi kaydederek (File > Save ) yukarıdaki işlemi yapalım.
Sample: Bu pencerede örnek butonları görürüz.
Style: Örnek butonların bulunduğu penceredir.
Button Text: Butonumuzun üzerinde yazacak olan yazıyı buradan yazıyoruz.
Font: Butonun üzerine yazmış olduğumuz yazının fontunu buradan ayarlıyoruz.
Size: Fontumuzun boyutu, puntosunu buradan ayarlıyoruz.
Link: Butonumuza vereceğimiz link. Htmle Giriş
Hypertext Markup Language (HTML ) belgelerin birbirlerine nasıl bağlanacaklarını ve belge içindeki metin ve resimlerin nasıl yerleşeceklerini belirleyen ve etiket (tag ) denilen kod parçalarından oluşan bir sistemdir. Belgeleri birbirlerine bağlamak için kullanılan Hypertextler oldukça güçlüdürler. Internet üzerinde yaşayan World Wide Web (Kısaca WWW ya da Web ), HTML sisteminin arkasında etkileşimli, çok platformlu, multimedia ve client/server uygulamaları yaratmak için kullanılır.
Web, formatlı metinler, ses ve resimlerden oluşan "yaşayan" belgelerden oluşur. Bu belgeler Webspace denen alanları oluşturur. Bir webspace tipik olarak,home page etrafında biriken linkli sayfalardan Dosya ve Dizin Yapısı UNIX altında bazı karakterlerin özel anlamları vardır. Dizin ve dosya isimlerinin başında nokta olması durumunda bu dosyalar gizli dosya haline gelir ve parametresiz yazılan ls komutuyla görünmez.
Dosya ve dizin isimleri 255 karakteri aşamazlar.
Sisteme girince önceden tanımlanmış bir dizin altında bulunursunuz. Bu dizin normal kullanıcılar için genellikle /home/ ve ardından gelen kullanıcı dizini ismidir. Bulunduğunuz dizinin ismini görmek için pwd(print working directory) yazın. Temel dosya ve dizin kavramları hakkında Elimizde 3 Adet sayfa olduğunu düşünelim
Mesela İletisim.php, Hakkimizda.php, Urunler.php
Şimdi bunların Linklerini gizleyelim tek sayfa gibi algılanmasını sağlayalım
Kod Alanı:
Kod Alanı: |
Kod: ( hakan.php olarak kaydedin )
Form işlemlerini kullanıcıdan bilgi almak amacıyla kullanırız. Formu html , formun işleneceği sayfayıda php sayfası olarak yaparız.İki çeşidi vardır. Biri post yöntemi diğeride get yöntemi ben ikisinide göstereceğim.
İlk post yöntemini gösteriyorum.Post yöntemi ile yaparken formda method parametresini post olarak ayarlarız.
--form.html--
<form action="isle.php" method="post">
<input type="text" name="ad">
<input type="submit" value="gönder"
</form>
--isle.php--
<?php
$gelenveri = $_POST["ad"];
echo ("adınız $gelenveri" );
?>
Şimdide get yöntemi ile yapalım. formu açarken verdiğimiz method PHP, o andaki zaman bilgisini, saat, dakika, saniye ve salise olarak; tarih bilgisini yıl, ay, gün (sayı veya isim olarak ), programımızın herhangi bir yerinde bize bildirebilir. Bu bilgiyi Web sunucusunda istediğimiz anda, muhtemelen sunucunun bulunduğu bilgisayarın sistem saatinden alacak olan PHP, sunucu programında farklı bölgesel ayarlar için gerekli düzenleme yapılmışsa, bu imkandan yararlanarak bize sunucunun değil, arzu ettiğimiz bölgenin saat ve tarihini bildirebilir.
Özellikle Türkiyede olmayan bir sunucuda bu imkanın bulunup bulunmadığını, ancak sınayarak veya sistem yöneticisine sorarak öğrenebiliriz. Böylebir sıNama için şu kodları programınızın başına koyun:
Ziyaretçilerimizin ne tür Browser kullandıklarını HTTP_USER_AGENT değişkeninin değerini alarak ve bu değerin içinde belirli anahtar kelimeleri aratarak bulabiliriz. Form ile gelen bilgiler, GET metodu ile alınıyorsa, hem QUERY_STRING, hem de HTTP_GET_VARS dizisine kaydolur. POST metoduyla aldığımız bilgileri HTTP_POST_VARS değişkenin değerleri arasında buluruz. Bunları öğrendiğimize göre, şimdi gerçekten bir HTML Formu yapabil ve bununla ziyaretçimizden bilgi alabiliriz.
Basit bir HTML Formu tasarlayalım. Aşağıdaki kodları formlar02.htm adılyla kaydedin:
AJAX, "Asynchronous JavaScript And XML" 'in kısaltılmışıdır. Ajax bir programlama yöntemidir ve 2005 yılında Google Suggest hizmetiyle popüler olmaya başlamıştır. Ajax bir programlama dili değildir sadece mevcut programlama dillerinin yeni bir kullanım yöntemidir. Ajax ile daha iyi, hızlı ve kullanıcı dostu internet uygulamaları geliştirebilirsiniz. Ajax Javascript ve HTTP istekleri üzerine kurulu bir yöntemdir.
AJAX "Asynchronous JavaScript And XML" 'in kısaltılmışıdır.
Derse başlamadan önce bilmeniz gerekenlerDerse başlamadan önce aşağıdakiler hakkında temel olarak bilgi sahibi olmanız gerekir: AJAX Http İstemleri kullanırGeleneksel JavaScript kodlarında, eğer sunucudaki bir veritabanından yada dosyadan bilgi almak isterseniz, yada sunucuya kullanıcı girdisini göndermek isterseniz bir HTML formu oluşturup GET yada POST yöntemlerinden biriyle sunucuyla veri alışverişi yaparsınız. Kullanıcı veriyi göndermek/almak için formdaki "Gönder" vb. bir düğmeyi tıklar, sunucunun yanıtını bekler ve sonuçları yeni yüklenen sayfada görür. Kullanıcının her veri girişinde sunucunun yeni bir sayfa oluşturmasını beklemesi nedeniyle geleneksel internet uygulamaları daha yavaş çalışabilir ve daha az kullanıcı dostu olabilir. Ajax ile, Javascript kodunuz XMLHttpRequest nesnesini kullanarak doğrudan sunucuyla iletişime geçer. Ajax 'ın nasıl çalıştığını anlamak için küçük bir ajax uygulaması oluşturacağız. İlk önce, username ve time adında iki metin girişi bulunan standart bir HTML formu oluşturacağız. username alanı kullanıcı tarafından doldurulacak ve time alanı AJAX tarafından doldurulacak. Oluşturduğumuz HTML dosyasının adı "testAjax.htm" olsun (bu formda gönder tuşunun olmadığına dikkat edin!): <html> <body> <form name="myForm"> Name: <input type="text" name="username" />
Time: <input type="text" name="time" /> </form> </body> </html> AJAX 'ın temeli XMLHttpRequest nesnesidir. Farklı tarayıcılar XMLHttpRequest nesnesini yaratmak için farklı işlevler kullanırlar. Internet Explorer bir ActiveXObject kullanırken, diğer tarayıcılar XMLHttpRequest adı verilen Javascript nesnesini kullanırlar. Bu projeyi oluşturmak ve farklı tarayıcılarla başa çıkmak için bir "try - catch" ifadesi kullanacağız. Önceden oluşturduğumuz "testAjax.htm" dosyamızı XMLHttpRequest nesnesini oluşturan Javascript kodumuzla güncelleyelim.:
Hanci.org sizlere daha iyi hizmet sunmak için çerezleri kullanıyor. Hanci.org sitesini kullanarak çerez politikamızı kabul etmiş olacaksınız.
Detaylı bilgi almak için Gizlilik ve Çerez Politikası metnimizi inceleyebilirsiniz.
|
|
|
|
|
|
|
|
|