Sesinizin Çıktığı Yerdesiniz... www.sesimiz.homegoo.com

Hayattan Keyif Almak istiyorsanız Doğru yerdesiniz...
 
AnasayfaAna SayfaTakvimGaleriSSSAramaKayıt OlGiriş yap
Giriş yap
Kullanıcı Adı:
Şifre:
Beni hatırla: 
:: Şifremi unuttum
En iyi yollayıcılar
admin -X-
 
mavihayal
 
Acemi_Prens
 
edra-sukeyna
 
Dj.YALNIZ
 
rabia
 
candy8803
 
tugce
 
gulsah
 
_e_s_r_a_
 
En son konular
» JILJDFSDFSD
Cuma Kas. 12, 2010 10:47 pm tarafından burak

» Tarkan - 2010 (Full)
Çarş. Tem. 28, 2010 10:30 pm tarafından admin -X-

» Günün Şarkısı... Kurban - Yalan
Cuma Tem. 23, 2010 10:27 pm tarafından admin -X-

» Sesimiz Forum 1. Yaşını Hediyelerle Kutluyor...
Cuma Tem. 23, 2010 9:50 pm tarafından admin -X-

» Forum kuralları
C.tesi Ocak 09, 2010 12:55 am tarafından Acemi_Prens

» cumanız mübarek olsun
C.tesi Ocak 09, 2010 12:55 am tarafından Acemi_Prens

» Yusuf Güney - Heder oldum aşkına
Perş. Ocak 07, 2010 5:20 pm tarafından Acemi_Prens

» İşte UEFA Fikstürü..!
Perş. Ocak 07, 2010 5:19 pm tarafından Acemi_Prens

» E - Bülten hizmeti başladı...
Perş. Ocak 07, 2010 5:19 pm tarafından Acemi_Prens

Anket

Paylaş | 
 

 5. DERS - Html İmage

Önceki başlık Sonraki başlık Aşağa gitmek 
YazarMesaj
admin -X-

avatar

Erkek
Mesaj Sayısı : 112
Yaş : 26
Nerden : G.antep
İş/Hobiler : Bilgisayar, Teknisyen
Lakap : uA uğruna
Kayıt tarihi : 06/02/09

MesajKonu: 5. DERS - Html İmage   Cuma Nis. 10, 2009 5:28 pm

5. HTML Dersi

Resimler (img) ve öncekilerin tekrarı (HTML image)
Yeni bir derste daha sizinle buluşmak güzel.
Şu ana kadar hangi HTML etiketlerini gördük bir gözden geçirelim;

...
Başlık yazmak için kullanılır.
Koyu ve büyük yazı elde edilir.
Başlık yazısının öncesinde ve sonrasında otomatik boşluk olur (paragraf olur).
Bazı arama motorları başlık özelliği olan cümledeki kelimeler aratıldığında sayfanızı öne çıkartır.



Yazının içinde bu etiket olduğunda etiketten sonraki yazı satır başından başlar.
Aynı anda iki tane kullandığınızda satır başı yapılmadan önce boş bir paragraf oluşur.


Yazılar üzerinde çeşitli işlemler yapabilirsiniz.
size özelliği ile yazının büyüklüğünü ayarlayabilirsiniz.
color özelliği ile yazıya renk verebilirsiniz.
Rengin ingilizce adını yazmanın yanında RGB koduyla da renk belirtebilirsiniz


HTML sayfanızın tamamı bu etiket arasında olmalıdır.
bgColor özelliği ile HTML sayfanıza tümden renk verebilirsiniz.
body etiketinin özellikleri tüm sayfayı etkileyecektir.


Bütün web sayfamız bu etiketin arasında olmalıdır.


Yazı içerisinde koyu (bold) yazmak istediğimiz kısımları bu etiket ile belirtiyoruz.


web sayfanızı adını bu html etiketiyle verebilirsiniz.
internet tarayıcısı (Web Browser) sayfanızı açtığında title daki isim ilgili pencerenin ismi olur.
Arama motorlarında sayfanızın ne ile ilgili olduğuna karar verirlirken title etiketi önemli bir kriterdir.


HTML sayfanızın genelini ilgilendiren özellikler bu etiketin arasında olmalıdır.
title etiketi bunlardan birisidir.
ileride META etiketileri diye öğreneceğimiz bazı etiketler vardır. Bu etiketler de head (baş/kafa) dediğimiz etiketin kapsamında olmalıdır.


--------------------------------------------------------------------------------
Bu dersimizde kullanacağımız HTML etiketleri ve özellikleri şunlardır:

Altı çizili yazı yazmamızı sağlar
italik yazı yazmamızı sağlar.

align özelliği, bir etiket değil etiketlerin birçoğunda kullanılan bir özelliktir.
align özelliğini aşağıda center değeriyle kullanacağız bundan başka align özelliği left ve right değerlerini de alabilir.
align 'ni

şeklinde kullanacağız.

Resim dosyalarını HTML web sayfamızda göstermemizi sağlar. SRC ile gösterilecek resmin adını belirtiriz.

Haydi derse başlayalım; aşağıdaki görünümde yukarıda bahsettiğimiz etiketler ve özellikler kullanılmıştır.

--------------------------------------------------------------------------------

Arılar Çiçeklere Yardım Eder

Bir arının günlüğü geçti elime, Okurken bazen hüzünlendim, bazen sevindim.
Yazmıştı küçük arı hislerini yaşam öyküsünde:
Her günkü gibi sabahın erken vaktinde çıkmıştım yollara.
Amaçlarımız vardı arı olarak, her gün o amacı yaşamak için kanat çırpıyorduk.
Güneşin doğuşu biz arılara yeni bir fırsattı.
O gün de renga renk olan çiçekler bulup onlarla sohbet edecektim.

Güzel olan renkleri görecek güzel kokular duyacaktım.
Çiçeklere yardım edecektim bugün yine;
İnsanlara anlatacaktım çiçeklerin hem göz hem burun hem kalp hem de dil için olduklarını
Çiçeklerin saklı olan güzelliklerini açığa çıkartacaktım.
İnsanların Rableri Allah'a şükretmelerini sağlamak için uğraşacaktım.
Allah dünyayı çiçeklerle doldurmuştu. Çiçekleri veren Rablerine insanların şükretmelerini sağlamak için uğraşacaktım.
Ama o gün ....


Yukarıdaki görüntüyü oluşturan HTML kodu aşağıdaki gibidir.
--------------------------------------------------------------------------------


Arıların Çiçeklere Yardımı


Arılar Çiçeklere Yardım Eder




Bir arının günlüğü geçti elime, Okurken bazen hüzünlendim, bazen sevindim.


Yazmıştı küçük arı hislerini yaşam öyküsünde:





Her günkü gibi sabahın erken vaktinde çıkmıştım yollara.
Amaçlarımız vardı arı olarak, her gün o amacı yaşamak için kanat çırpıyorduk.
Güneşin doğuşu biz arılara yeni bir fırsattı.
O gün de renga renk olan çiçekler bulup onlarla sohbet edecektim.

Güzel olan renkleri görecek güzel kokular duyacaktım.
Çiçeklere yardım edecektim bugün yine;
İnsanlara anlatacaktım çiçeklerin hem göz hem burun hem kalp hem de dil için olduklarını
Çiçeklerin saklı olan güzelliklerini açığa çıkartacaktım.
İnsanların Rableri Allah'a şükretmelerini sağlamak için uğraşacaktım.
Allah dünyayı çiçeklerle doldurmuştu. Çiçekleri veren Rablerine insanların şükretmelerini sağlamak için uğraşacaktım.
Ama o gün ....





--------------------------------------------------------------------------------

Yukarıdaki kodlar hakkında birşeyler söylemek istiyorum. (Çalışmayı tarayıcıda görmek için buraya tıklayınız)

Daha önceki dersimizde şunu söylediğimizi hatırlayın;
Bütün html kodları buraya yazılır.
Bu bir kalıptır ve bu kalıba uymak zorundayız.

center kelimesinin anlamı merkezdir; Burada başlığımızı web sayfasının ortasına getirmiştir.

Bazı html etiketleri align özelliğini almaktadır burada header etiketi bu özelliği aldı.

balarisi.jpg dosyası ve sariikicicek.jpg dosyaları html dosyanızla aynı yerde olmalıdır.
Bu resimleri bilgisayarınıza alabilmek için resimlerin üzerine fare (mouse) ile sağ tıklayın.
Gelecek olan menüden Resmi farklı kaydetmeyi seçin.
Unutmayın farklı bir yere değil html dosyanızın olduğu yere kaydedin.


HTML sayfanızı internet tarayıcısında açtığınızda yukarıdaki gibi bir görüntü elde ederseniz bu şu anlama geliyor;
Resimler ilgili html sayfanızla aynı yerde değil.
eğer yukarıdaki bir görüntüyle karşılaştıysanız;
img etiketinin src özelliğinde belirtilen isimlerdeki resimlerin olup olmadığını kontrol ediniz.


HTML etiketleri bir birlerini kesemezler:
Açtığımız herhangi bir etiketin içindeyken (o kapanmadan) başka etiket açabiliriz.
Birden fazla etiketi açtığımızda kapatırken dikkat etmeniz gereken şey
en son açılan etiket ilkin kapanmalıdır.
Bu dediğimi şu şekilde örneklemek istiyorum:
etiketini açtık henüz font etiketi kapanmadan () bir başka etiket açtık (italik yazma).
Bu iki etikette henüz kapanmadı ve biz 3. etiket olan (altı çizilmiş yazı) açtık.

Lütfen Etiketlerin kapatılma sırasına dikkat edin.
en son açılan kapatılıyor
daha sonra kapatılıyor
en son da kapatılıyor

Bu yukarıdaki resimle sizlere HTML etiketlerini kapatırken son açılan etiketi önce kapatmanız gerektiğini anlatmaya çalıştım.

Kullanabileceğiniz Bazı HTML Renk Kodları Aşağıdadır.
#000000 #000020 #000040 #000060 #000080 #0000A0 #0000C0 #0000E0
#002000 #002020 #002040 #002060 #002080 #0020A0 #0020C0 #0020E0
#004000 #004020 #004040 #004060 #004080 #0040A0 #0040C0 #0040E0
#006000 #006020 #006040 #006060 #006080 #0060A0 #0060C0 #0060E0
#008000 #008020 #008040 #008060 #008080 #0080A0 #0080C0 #0080E0
#00A000 #00A020 #00A040 #00A060 #00A080 #00A0A0 #00A0C0 #00A0E0
#00C000 #00C020 #00C040 #00C060 #00C080 #00C0A0 #00C0C0 #00C0E0
#00E000 #00E020 #00E040 #00E060 #00E080 #00E0A0 #00E0C0 #00E0E0


#200000 #200020 #200040 #200060 #200080 #2000A0 #2000C0 #2000E0
#202000 #202020 #202040 #202060 #202080 #2020A0 #2020C0 #2020E0
#204000 #204020 #204040 #204060 #204080 #2040A0 #2040C0 #2040E0
#206000 #206020 #206040 #206060 #206080 #2060A0 #2060C0 #2060E0
#208000 #208020 #208040 #208060 #208080 #2080A0 #2080C0 #2080E0
#20A000 #20A020 #20A040 #20A060 #20A080 #20A0A0 #20A0C0 #20A0E0
#20C000 #20C020 #20C040 #20C060 #20C080 #20C0A0 #20C0C0 #20C0E0
#20E000 #20E020 #20E040 #20E060 #20E080 #20E0A0 #20E0C0 #20E0E0


#400000 #400020 #400040 #400060 #400080 #4000A0 #4000C0 #4000E0
#402000 #402020 #402040 #402060 #402080 #4020A0 #4020C0 #4020E0
#404000 #404020 #404040 #404060 #404080 #4040A0 #4040C0 #4040E0
#406000 #406020 #406040 #406060 #406080 #4060A0 #4060C0 #4060E0
#408000 #408020 #408040 #408060 #408080 #4080A0 #4080C0 #4080E0
#40A000 #40A020 #40A040 #40A060 #40A080 #40A0A0 #40A0C0 #40A0E0
#40C000 #40C020 #40C040 #40C060 #40C080 #40C0A0 #40C0C0 #40C0E0
#40E000 #40E020 #40E040 #40E060 #40E080 #40E0A0 #40E0C0 #40E0E0


#600000 #600020 #600040 #600060 #600080 #6000A0 #6000C0 #6000E0
#602000 #602020 #602040 #602060 #602080 #6020A0 #6020C0 #6020E0
#604000 #604020 #604040 #604060 #604080 #6040A0 #6040C0 #6040E0
#606000 #606020 #606040 #606060 #606080 #6060A0 #6060C0 #6060E0
#608000 #608020 #608040 #608060 #608080 #6080A0 #6080C0 #6080E0
#60A000 #60A020 #60A040 #60A060 #60A080 #60A0A0 #60A0C0 #60A0E0
#60C000 #60C020 #60C040 #60C060 #60C080 #60C0A0 #60C0C0 #60C0E0
#60E000 #60E020 #60E040 #60E060 #60E080 #60E0A0 #60E0C0 #60E0E0


#800000 #800020 #800040 #800060 #800080 #8000A0 #8000C0 #8000E0
#802000 #802020 #802040 #802060 #802080 #8020A0 #8020C0 #8020E0
#804000 #804020 #804040 #804060 #804080 #8040A0 #8040C0 #8040E0
#806000 #806020 #806040 #806060 #806080 #8060A0 #8060C0 #8060E0
#808000 #808020 #808040 #808060 #808080 #8080A0 #8080C0 #8080E0
#80A000 #80A020 #80A040 #80A060 #80A080 #80A0A0 #80A0C0 #80A0E0
#80C000 #80C020 #80C040 #80C060 #80C080 #80C0A0 #80C0C0 #80C0E0
#80E000 #80E020 #80E040 #80E060 #80E080 #80E0A0 #80E0C0 #80E0E0


#A00000 #A00020 #A00040 #A00060 #A00080 #A000A0 #A000C0 #A000E0
#A02000 #A02020 #A02040 #A02060 #A02080 #A020A0 #A020C0 #A020E0
#A04000 #A04020 #A04040 #A04060 #A04080 #A040A0 #A040C0 #A040E0
#A06000 #A06020 #A06040 #A06060 #A06080 #A060A0 #A060C0 #A060E0
#A08000 #A08020 #A08040 #A08060 #A08080 #A080A0 #A080C0 #A080E0
#A0A000 #A0A020 #A0A040 #A0A060 #A0A080 #A0A0A0 #A0A0C0 #A0A0E0
#A0C000 #A0C020 #A0C040 #A0C060 #A0C080 #A0C0A0 #A0C0C0 #A0C0E0
#A0E000 #A0E020 #A0E040 #A0E060 #A0E080 #A0E0A0 #A0E0C0 #A0E0E0


#C00000 #C00020 #C00040 #C00060 #C00080 #C000A0 #C000C0 #C000E0
#C02000 #C02020 #C02040 #C02060 #C02080 #C020A0 #C020C0 #C020E0
#C04000 #C04020 #C04040 #C04060 #C04080 #C040A0 #C040C0 #C040E0
#C06000 #C06020 #C06040 #C06060 #C06080 #C060A0 #C060C0 #C060E0
#C08000 #C08020 #C08040 #C08060 #C08080 #C080A0 #C080C0 #C080E0
#C0A000 #C0A020 #C0A040 #C0A060 #C0A080 #C0A0A0 #C0A0C0 #C0A0E0
#C0C000 #C0C020 #C0C040 #C0C060 #C0C080 #C0C0A0 #C0C0C0 #C0C0E0
#C0E000 #C0E020 #C0E040 #C0E060 #C0E080 #C0E0A0 #C0E0C0 #C0E0E0


#E00000 #E00020 #E00040 #E00060 #E00080 #E000A0 #E000C0 #E000E0
#E02000 #E02020 #E02040 #E02060 #E02080 #E020A0 #E020C0 #E020E0
#E04000 #E04020 #E04040 #E04060 #E04080 #E040A0 #E040C0 #E040E0
#E06000 #E06020 #E06040 #E06060 #E06080 #E060A0 #E060C0 #E060E0
#E08000 #E08020 #E08040 #E08060 #E08080 #E080A0 #E080C0 #E080E0
#E0A000 #E0A020 #E0A040 #E0A060 #E0A080 #E0A0A0 #E0A0C0 #E0A0E0
#E0C000 #E0C020 #E0C040 #E0C060 #E0C080 #E0C0A0 #E0C0C0 #E0C0E0
#E0E000 #E0E020 #E0E040 #E0E060 #E0E080 #E0E0A0 #E0E0C0 #E0E0E0
Sayfa başına dön Aşağa gitmek
Kullanıcı profilini gör http://sesimiz.homegoo.com
 
5. DERS - Html İmage
Önceki başlık Sonraki başlık Sayfa başına dön 
1 sayfadaki 1 sayfası
 Similar topics
-
» açık öğretim
» vBulletin Güvenlik Önlemleri 3

Bu forumun müsaadesi var:Bu forumdaki mesajlara cevap veremezsiniz
Sesinizin Çıktığı Yerdesiniz... www.sesimiz.homegoo.com :: BİLİŞİM - İNTERNET :: HTML Dersleri-
Buraya geçin: