Articles by "ler"
ler etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
En yeni konular, en gücel haberler. En son çıkan internet haberleri. Oyun haberleri. Hepsi webtegez.blogspot.com'da..
gezilecek yerler, gezilmesi gereken yerler

 İş stresi, okul stresi felan derken bir dönem boyunca o kadar çok stres içine girip bunalıyoruz ki artık bu tatil zamanları gelse de bir yerlere kaçıp, kafamı adam gibi dinlesem diye kara kara düşünüp bu güzel hayalleri kuruyoruz. Ama tatil zamanı gelince de işin boyutu bir hayli değişiyor. "Acaba nereye gitsem?", "Nereye gidersem çok eğlenebilirim?", "Nereye gidersem kafamı dinleyebilirim?" vb. gibi bin bir türlü düşüncelere kapılıp o kadar düşündükten sonra gider sıradan bir klasik yer bulur oralarda tatilimizi geçiririz ve tatilin nasıl geçtiğini anlayamayız bile. Sizin açınızdan bilmem ama benim ve tanıdıklarımın çoğu açısından bu böyle geçmektedir.

 Ama artık bende yolunu buldum. İnternette o kadar araştırma yaptım ama artık nasıl olduysa karşıma bu site çıkınca gerçekten bir hayli şaşırdım ve çokta beğendim diyebilirim açıkcası. Çünkü gerçekten içinde o kadar çok kaynak bilgiler olmasına rağmen gezebilecek, kafama uygun yeri çok rahatça buluyorum veya tanıdıklarıma buradan bakarak tavsiyeler veriyorum ve verdiğim tavsiyelerde kötü çıkmıyor.
 Çünkü herhangi bir gezilecek yeri o kadar çok iyi anlatım yapılıyor ki, orayı gerçekten gezip yada gezmemek istediğinizi rahatça anlayabiliyorsunuz.

Benden size tavsiye, bir yaz vakti bir kerede buradan bulup gidin derim

İşte Site: www.gezilmesigerekenyerler.com
En yeni konular, en gücel haberler. En son çıkan internet haberleri. Oyun haberleri. Hepsi webtegez.blogspot.com'da..
CSS ve Div İle Yazıları vs. Yan Yana Yazma - float
Merhaba arkadaşlar.

 Bu yazımda çoğu kişinin zorlandığı arayıpta zor bulduğu bir konuyu paylaşmak istiyorum.

 Herhangi iki tane yazı veya her hangi iki tane html kodu bazen görünüş veya ihtiyaç bakımından web sitemizde yan yaana yazmak isteyebilirsiniz. Yan yana derken biri tam sola diğer tam sağa gibi.

 Örnek olarak aşağıya bakınız:



Soldaki Yazı
Sağdaki Yazı


Yukarıdan gördüğünüz gibi ikiside yan yana aynı hizada biri tam sola diğeri tam sağa geçmiş durumda. Aslında görünüşte çok kolay gözükebilir bunda ne var diye. Am inanın çoğu arkadaşlar bunu çok arıyorlar.

 Benim bile başıma gelmişti eskilerden. Her türlü deneme yapıyordum ama olmuyordu.

Özelllikle mesela:

Soldaki Yazı <div style="align:right;">Sağdaki Yazı</div>

 vb. gibi bir sürü kodlar denememe rağmen olmuyordu. Hep aşağıdaki gibi bir sonuç alırdım.

Soldaki Yazı
Sağdaki Yazı

Sağa doğru yanaştırırdım ama diğeriyle aynı hizada olmazdı. Ve bende araştırmalarım sonucunda bu sorunu buldum.

 CSS kodunyla "float" ile artık herşey çok güzel olacak :)
Soldaki Yazı <div style="float:right;"></div>

 İşte yukarıdaki kod ile neyin sağ tarafına yazmak istiyorsanız o koddan hemen sonra <div> ile başlayan kodu yazarak istediğinizi başarıyla yapabilirsiniz.

Hepinize koaly gelsin arkadaşlar. Bundan böyle web sitenizin tasarımları bir başka güzel olacak :)
En yeni konular, en gücel haberler. En son çıkan internet haberleri. Oyun haberleri. Hepsi webtegez.blogspot.com'da..
Merhaba arkadaşlar.!

 Size ufak bir konuya değineceğim. Günümüz öyle bir zamana geldiki; büyük-küçük, genç-yaşlı herkes ünlü olma peşinde. Tamam ünlü olmalarına lafım yok. Elbette her insan milyonlarca insan tarafından tanınmasını ister ama bu işleri yaparken kendinizi küçük düşürecek şekilde tanıtmadan.
 Özelliklede ufak yaşta olan kız-erkek çocuklar kendilerini herkeslere rezil ettirmek için bin bir türlü, akıl almaz, bazende ufak kız çocukları sırf bir popülerlik yolu için cinsellik konularda bile video çekiliyor. Bu bazılarına göre normal gelsede ben ve benim gibi insanlar için gerçekten çok kötü bir durum. Çünkü bu çocuklar bu yaşta böyle şeyler yapma peşine düşerse ileride büyüdükleri zaman daha kötü işler peşine düşebilirler. Lütfen arkadaşlar eğer çevrenizde, etrafınızda böyle insanlar varsa sizden uyarmanızı rica ediyorum..!
Bunla ilgili bir örnek olarak ise aşağıda bir video bulunmaktadır. Bu ve bunlar gibi, helede küçük yaşlardakiler internette videoları gerçekten ciddi anlamda çok fazla bulunmakta.

En yeni konular, en gücel haberler. En son çıkan internet haberleri. Oyun haberleri. Hepsi webtegez.blogspot.com'da..
 Arkadaşlar aşağıda okuyacağınız hikaye gerçekten ama gerçekten çok ibretlik bir hikaye. Hikaye resimlerle  derlenip düzenlenip oluşturulmuş bir hikaye. İlginç ama bir o kadarda mantıklı ve telafisi olmayan bir hikaye. Lütfen herkes bu hikayeden kendi hayatına bir pay biçsin...

İlginç Birşey ve Telafisi Olmayan Şeyler - İlginç Hikaye

İlginç Birşey ve Telafisi Olmayan Şeyler - İlginç Hikaye

İlginç Birşey ve Telafisi Olmayan Şeyler - İlginç Hikaye

İlginç Birşey ve Telafisi Olmayan Şeyler - İlginç Hikaye

İlginç Birşey ve Telafisi Olmayan Şeyler - İlginç Hikaye

İlginç Birşey ve Telafisi Olmayan Şeyler - İlginç Hikaye

İlginç Birşey ve Telafisi Olmayan Şeyler - İlginç Hikaye

İlginç Birşey ve Telafisi Olmayan Şeyler - İlginç Hikaye

İlginç Birşey ve Telafisi Olmayan Şeyler - İlginç Hikaye

İlginç Birşey ve Telafisi Olmayan Şeyler - İlginç Hikaye

İlginç Birşey ve Telafisi Olmayan Şeyler - İlginç Hikaye

En yeni konular, en gücel haberler. En son çıkan internet haberleri. Oyun haberleri. Hepsi webtegez.blogspot.com'da..
Google Chrome Eklentileri
WebteGez Yöneticileri Seçimiyle ve Bazılarını Bizimde Kullandığımız, İşinize Yarayacak En İyi Google Chrome Eklentileri.

 Google öyle bir web tarayıcı çıkardıki kısa sürede gerçekten ciddi anlamda tarayıcı kullanıcısı arttı. Ve şimdi ise milyarlar bu programı kullanmaktadır. Ama kullanmaktada en iyi program bu çünkü. Hem hızlı, hem kolay, hem sade bir arayüze sahip tarayıcı.
 Google Chrome çıktıktan sonra yüzlerce internet şirketi(arama motoru siteleri gibi.) kendilerinide büyütmek için Google Chrome ile bire bir tarayıcılar çıkarıp kendi logosunu yerleştirip herkese yayıyorlar.
 Nese arkadaşlar biz konumuza geçelim. Bu konumuzda size işte bu Google Chrome web tarayıcısı kullananlara yani sizin için kullanabileceğiniz en iyi eklentileri burada paylaşacağım. Webmaster'lar için birebir ama günlük normal hayatınızda da kullanabileceğiniz programlar mevcut.
 Böyle elime geçtikçe yayınlayacağım.

Photo Zoom for Facebook
Photo Zoom for Facebook (FaceBook Fotoğraf Yakınlaştırma)

 FaceBook fotoğraflarınız en iyi, en hızlı şekilde görüntülemek için en iyi yol.
 Bu eklenti ile fotoğraflara tıklayıp açılmasını beklemeden, fotoğrafların üzerine geldiğiniz zaman fotoğrafın tam ve net halini direkt karşınıza büyük olarak göstermektedir. Milyonların kullandığı bu programı kaçırmamanızı öneririm.

RSS Feed Reader (RSS Besleme Okuyucu)

 Basit bir genel RSS ve Atom beslemelerini okumak  için araç çubuğunda yer alır.
 Bu eklentiyi webmasterlar için gerçekten öneririm. Bu eklenti sayesinde takip etmek istediğiniz binlerce sitenin RSS'sini buraya ekleyebilir web site bir şey paylaştığı zaman anında sana bildirim olara bildirsin. Web sitelerde dolaşırken RSS'sini otomatik bulur siz isterseniz bir tık ile ekleyebilirsiniz. Çoğu webmaster'ların kullandıkları güzel bir eklenti..

Alexa Traffic Rank (Alexa Rating Sırası Öğrenme)

Resmi Alexa Rating Sıralama Uygulaması. Alexa trafik sıralaması ve siteyer her tıklandığında tıklandığında size bilgi sağlayan webmasterlar için olmazsa olmaz olan bir eklenti. Bu eklenti ile kendi sitenizide her dakika takip etmiş olabilirsiniz ve sitenizin Rank durumunu istediğiniz her an kolayca öğrenebilirsiniz.

İmgur (Kolay Resim Upload)

 Resimlerinizi sadece sürükle-bırak yaparak upload edip direk link almak istiyorsanız son derece kullanışlı bir eklenti.
 Başka uplod sitelerine gidip uğraşıp, upload etme derdine son.! Artık imgur ile fotoğraflarınızı ister sürükle-bırak yöntemi ister ise sağ tık yöntemi ile 1 dakikadan daha kısa sürede fotoğrafınızı internete upload edin hemen linkini alın.

Quick Note (Hızlı Not)

Chrome'da en hızlı not almanın yolu. En iyi masaüstü not alma uygulaması kadar hızlı ve etkin.
 Quick Note, özellikle küçük notlar almak için tasarlanmıştır. Herhangi bir not defteri, karalama tahtası, pano veya yapılacaklar listesi gibi kullanabilirsiniz.
 Sayfa esnasında sağ tık ile buna ulaşabilir veya web sitede almak istediğiniz sözcük veya sözcükleri mouse ile saçıp sağ tık ilede hemen anında ekleyebilirsiniz.
En yeni konular, en gücel haberler. En son çıkan internet haberleri. Oyun haberleri. Hepsi webtegez.blogspot.com'da..

Turkcell vınn dns değiştirme ayarları, resimli anlatım (kesin çözüm)
turkcell vınn
Hepimizin bildiği gibi Turkcell VINN ile yasaklı sitelere giremiyoruz. Aslında giriyoruz fakat nasıl ayar yapmamız gerektiğini tam olarak bilmediğimizden dolayı çeşitli sorunlar ile karşılaşıyoruz. Bu sorunlar yüzünden siz değerli ziyaretçilerimize resimli bir şekilde Turkcell vınn dns değiştirme ayarlarının nasıl yapıldığını anlatmaya çalışacağız.
Öncelikle Belgelerim klasöründen VINN klasörüne girin.
Daha sonra orada rasphone.pbk isimli bir dosya var onu çift tıklayıp çalıştırın.
Daha Daha sonra :) kullandığınız bağlantıyı seçin ve özellikler butonuna tıklayın.
Açılan pencerede bağlantılar sekmesine gelin ve TCP/IPv4′ü seçip özellikler butonuna tıklayın.
Orada DNS ayarlarımı manual yapılandır seçeneğini seçin ve girmek istediğiniz DNS ip lerini girip kaydedip çıkın. Sonra Turkcell VINN programını kapatıp tekrar açın bağlanın ayarlarınız aktif olması gerekir.
İlgili ekran görüntüleri yani resimler aşağıda yer almaktadır.
Takıldığınız yerde lütfen çekinmeden yorum bölümümüzden bize sorun cevaplayalım.
En yeni konular, en gücel haberler. En son çıkan internet haberleri. Oyun haberleri. Hepsi webtegez.blogspot.com'da..

HTML İle Web Sitesi Hazırlama.

Hayvan ResimleriKöpek Resimleri


Tek satırlı iki hücreli bir tablo oluşturuyoruz. Tablonun genişliği (width) 850 piksel uzunluğundadır. 
 
<table align=center> şeklinde hizalama belirttiğimizde sayfa içinde tabloyu hizalamış (ortalamış) oluruz. 
<tr> ve <td> HTML etiketlerinin align özelliğine değer verdiğimizde ise hücre içindekileri hizalamış oluruz. (şu anda vermedik) 
Yukarıdaki iki hücreli tabloya dikkat ederseniz sayfa içinde ortalanmış durumda. 

Tabloya veya Satıra veyahut hücreye yükseklik değeri vermediğimiz halde tablonun belli bir yüksekliği var. 
Bunun nedeni biz yükseklik (height) değeri vermemiş olsak bile hücre içindeki nesne tablonun belli bir yükseklik almasını sağlar. 
Eğer biz hücre içindeki yazı yada yazılardan birinin puntosunu (büyüklüğünü) arttırır yada azaltırsak hücre yüksekliğide buna göre değişecektir. 
Biz eğer tabloya yada hücreye yükseklik verseydik ve daha sonra yazı büyüklüğünü (puntoyu) arttırsaydık tablo yüksekliğinde değişme (bozulma) olmazdı. Çünkü hücre içindekilerin ihtiyaçı olan yükseklikten daha fazla yüksekliği en başta vermiş olacaktık. 

<table border=1 width=850 align=center> 
  <tr> 
    <td> Hayvan Resimleri </td> 
    <td> Köpek Resimleri </td>
  </tr>
</table>


Hayvan ResimleriKöpek Resimleri


Birinci hücrenin align özelliğini sol (left) olarak veriyoruz; Hayvan resimleri ifadesi hücrenin soluna hizalanıyor. 
 
Sol yada sağ ifadelerinden kasıt sizin ekrana bakarken ki sağınız ve solunuzdur. 
ikinci hücrenin align özelliğini ise right yapıyoruz sağa hizalamak için. 

<table border=1 width=850 align=center>
  <tr>
    <td align=left> Hayvan Resimleri </td>
    <td align=right>Köpek Resimleri </td>
  </tr>
</table>
 


Hayvan ResimleriKöpek Resimleri


Hayvan Resimleri ifadesini büyültmek için font etiketinin size özelliğine 6 değerini veriyoruz. 
 
Önceki derslerimizden şunu hatırlayın: Html etiketleri birbirini kesemez. 
HTML kodlamada dikkat etmeniz gereken husus : en son açılan etiket ilk önce kapatılmalıdır. 

font etiketinin size=6 ile etkileyeceği bütün kelimelerin font etiketi arasında olması gerekir. 
İnşaAllah ilerleyen derslerimizde sizlerle HTML sayfalarındaki yazılara biçim verirken CSS diye bir teknik kullanacağız. 
Şu anda biçim ve büyüklük verirken font etiketini size ve face özellikleriyle kullanacağız. 

<table border=1 width=850 align=center> 
  <tr>
    <td align=left> <font size=6 > Hayvan Resimleri </font> </td> 
    <td align=right> <font size=6 > Köpek Resimleri </font> </td> 
  </tr> 
</table>
 


Hayvan ResimleriKöpek Resimleri



Daha önce sizlere tablo davranışı diye bir ifade kullanmıştım. 
 
Bazen tablo görüntüsü değil davranışı için table etiketini kullanırız; 
Bunu table etiketinin border özelliğine sıfır değerini vererek elde ederiz. 
border özelliğini daha önce img (resim) etiketinde de kullandığımızı hatırlayın. 

Ekranın sağından soluna doğru ince ve siyah bir çizgi çizmek için <hr> etiketini kullanıyoruz. 
Birçok HTML etiketinin alabildiği özellikler olan; 
    align (hizalama)
    color (renklendirme)
    width (genişlik) 
Özelliklerini hr etiketi içinde kullandık. 

<table border=0 width=850 align=center> 
  <tr>
    <td align=left> <font size=6 > Hayvan Resimleri </font> </td> 
    <td align=right> <font size=6 > Köpek Resimleri </font> </td>
  </tr>
</table>

<hr color=black width=850 align=center>
 
Hayvan ResimleriKöpek Resimleri


   


 İlk tablo gibi ikinci tablonunda align özelliğini center yapıp tablonun sayfada ortalı olmasını sağlıyoruz. 
Tek satırlı ve 3 sutunlu bir tablo elde etmek için kodları yukarıdaki gibi ekledik. <tr> ....... </tr> 
Nokta nokta olan yerde üç tane hücre tanımı var. hücrelerin ilk ikisinin genişliği 168 piksel dir. 
üç hücreden birine yükseklik verdiğimizde diğer ikisi de otomatik olarak o yükseklikte olacaktır. 

&nbsp; kodunu <td> ile </td> arasında kullanmamızın nedeni şudur: 
içinde hiçbirşey olmayan hücreyi web tarayıcısı göstermeyecektir. O hücrenin görünmesi için &nbsp; yi hücre içinde kullandık. 
Geçmiş derslerimizden şunu hatırlayın; &nbsp; kodunu birden fazla boşluk vermek istediğimizde yanyana kullanıyorduk. Web tarayıcısı birden fazla boşluk &nbsp; kodu kullanılarak verilmediyse birçok boşluğu tek boşluk gibi algılıyordu. 

<table border=0 width=850 align=center> 
  <tr> 
    <td align=left> <font size=6 > Hayvan Resimleri </font> </td> 
    <td align=right> <font size=6 > Köpek Resimleri </font> </td>
  </tr>
</table>


<hr color=black width=850 align=center>

<br>

<table border=1 align=center>
  <tr>
    <td width=168> &nbsp; </td>
    <td width=336 height=280> &nbsp; </td>
    <td width=168> &nbsp; </td>
  </tr>
 </table>

Hayvan ResimleriKöpek Resimleri


 


İlk hücrenin içine iki tane resim ekleyeceğiz şimdilik bir tanesini ekleyelim. 
 
ikinci ve büyük hücreyi reklam alanı olarak düşündüm. 
üçüncü hücreye de bir tane resim ekleyelim. 

Şuna dikkat edin: Hücreye align (yatay hizalama) ve valign (dikey hizalama) değeri vermediğimizde, 
Varsayılan yatay hizalama şekli sol tarafa doğrudur. Hücre içindeki resim sanki align=left yapmışız gibi hizalanıyor. 
Dikey hizalamada geçerli değer ise middle (ortalı) dır. 
Resim ne hücrenin üstüne (top) hizlanmış ne de altına (bottom) doğru hizalanmış. Biz dikey hizalamada hiçbirşey belirtmemiş olmamıza rağmen sanki valign=middle yazmışız gibi davranıyor. 

Sizler <img> etiketini biliyorsunuz. Img etiketinin src özelliği ile resmin nerede olduğunu belirtiyoruz. 
Eğer resim html sayfamızla aynı yerde değil bir dizinin içindeyse resmin adını direk yazmıyoruz. 
Resmin adından önce içinde bulunduğu klasörün adını yazıp (kopek-1) araya slaş işareti (/) koyuyoruz. 
Böylece Kopek (2).jpg dosyasının nerede olduğunu src özelliğiyle img etiketine belirtmiş olduk. 

..........................
........................................
..................................................

<table border=1 align=center>
  <tr>
    <td width=168> <img src="kopek-1/Kopek (2).jpg"> </td>
    <td width=336 height=280>   </td>
    <td width=168> <img src="kopek-1/Kopek (3).jpg"> </td>
  </tr>
</table>


 
Hayvan ResimleriKöpek Resimleri


   


Bir yere dikkatinizi çekmek için ilk hücrenin genişlik (width) değerini 368 piksel yaptım. 
 
önceki sayfada 1. hücrede tek resim 3. hücrede de tek resim vardı. 
Şu anda geçici olarak 1. hücreyi 368 piksel genişliğine getirdim 3. hücrenin genişliğine ise dokunmadım 168 olarak duruyor. 
Aynı hücreye ikinci bir resim eklediğimizde eğer hücre genişliği yeterli ise ikinci resim 1. resmin hemen yanında yer alıyor. 
3. hücreye dikkat edin hücrenin genişliği 168 (yetersiz geliyor) o yüzden iki resim altlı üstlü gözüküyor. 

Bir şeyi daha söyleyip sonraki aşamaya geçmek istiyorum: 
<tr> etiketine align=center özelliğini verdiğimizde align=center özelliğini alan <tr> etiketinin içinde ne kadar hücre varsa (o satırdaki bütün hücreler) aynı hizalama değerini alacaktır. Burada da her üç hücrede align = center özelliğini aldı; 
Yani yatay hizalamaları ortalı oldu. 


....................
................................
.........................................

<table border=1 align=center>
  <tr align=center>
    <td width=368> <img src="kopek-1/Kopek (2).jpg"> <img src="kopek-1/Kopek (3).jpg"> </td>
    <td width=336 height=280>   </td>
    <td width=168> <img src="kopek-1/Kopek (4).jpg"> <img src="kopek-1/Kopek (5).jpg"> </td>
  </tr>
</table>


 
Hayvan ResimleriKöpek Resimleri


 

  



Aynı hücredeki iki resim arasında <br> etiketini kullanarak aralarında bir miktar boşluk verdik. 
 
Altlı üstlü olmalarını nedeni <br> etiketi değidlri çünkü yanyana gelmeleri için hücre genişliği yeterli değil. 
ilk hücrenin genişliğini tekrar 168 piksele getirdim. Bir önceki sayfada söylediğimi tekrar söylüyorum. 
Hücrenin genişliği yeterli değilse iki resim yanyana gelmez altlı üstlü olurlar. 

Tablo çizgilerini kaldırmak için table etiketinin border özelliğine 0 değerini veriyoruz. 
Böylece tablonun görüntüsü değil davranışını kullanmış oluyoruz. 
Çoğu kez html sayfasında istediğimiz yerleşimi sağlamak için <table>....</table> etiketini kullanırız. 
table etiketi içinde <tr>....</tr> alt etiketi yer alır. satır ifade eden tr etiketinin alt etiketi ise <td>....</td> dir. 

..........................
......................................
..............................................

<table border=0 align=center>
  <tr align=center>
    <td width=168> <img src="kopek-1/Kopek (2).jpg"> <br><br> <img src="kopek-1/Kopek (3).jpg"> </td>
    <td width=336 height=280>   </td>
    <td width=168> <img src="kopek-1/Kopek (4).jpg"> <br><br> <img src="kopek-1/Kopek (5).jpg"> </td>
  </tr>
</table>


 
Hayvan ResimleriKöpek Resimleri


 

  

     
     


Yeni bir tablo oluşturalım. Tablo iki satırdan oluşsun ve 5 sutundan meydana gelsin. 
 
Toplamda 2 x 5 = 10 hücreli bir tablo olacak. 
Fakat size &nbsp; 'in boş hücre içinde kullanılmasının ne demek olduğunu uygulamalı olarak göstermek istiyorum. 
Aşağıdaki mavi koda dikkat ederseniz 1. satırın 3. 4. ve 5. hücrelerinde &nbsp; html etiketi yok. 
Sonucu yukarıya bakıp görebilirsiniz. Tanımlamada hücre olmasına rağmen görüntüde 3 hücre kayıp. 
Nedeni o hücreler bomboş bu yüzden tarayıcı o hücreleri göstermeye gerek duymuyor. 
Bir boşluk yerine geçen &nbsp; olan hücreler ise görsel olarak görülebiliyor. 
normalde birinci satırda 5 hücre ikinci satırda 5 hücre olmak üzere toplamda 10 hücre olması gerekirken toplam 7 hücre görülüyor. 

Ayrıca,
Tabloda bir hücrenin genişliği ne ise o sutundaki bütün hücreler o genişliği alırlar. 
Sadece birinci satırdaki hücrelere genişlik verilmesinin nedeni budur. 
3. sutun hariç hepsi 168 piksel genişliğinde. 
Yükseklik (height) belirtilmediği için varsayılan yazı büyüklüğüne göre boy alan &nbsp; boyundadır. (&nbsp; de bir karakterdir) 

<table border=1 align=center>

  <tr>
    <td width=168> &nbsp; </td>
    <td width=168> &nbsp; </td>
    <td width=130> </td>
    <td width=168> </td>
    <td width=168> </td>
  </tr>

  <tr>
    <td> &nbsp; </td>
    <td> &nbsp; </td>
    <td> &nbsp; </td>
    <td> &nbsp; </td>
    <td> &nbsp; </td>
  </tr>

</table>


 
Hayvan ResimleriKöpek Resimleri


 

  

 

 

 

    
     


Şuna dikkat ediniz. İlk satırın 1. hücresine 4 adet resim koyunca bütün hücreler en yüksek hücre olan 1. hücrenin yüksekliğine uydular. 
 
Bir tablo hücresine yükseklik (height) verilmediğinde içindeki şeylerin ona kazandırdıracağı yükseklik (height) kadar yükseklik (height) alırlar. 
Her bir resim arasına iki tane <br><br> kodu ilave edilmiştir. 
Resimlerin sağa (hücre kenarına) yapışık olmalarının nedeni align (hizalama) değeri vermediğimizdendir. 
Biz align belirtmediğimiz için varsayılan yatay hizalama olan left (sola hizalı) şeklini aldı. 

<table border=1 align=center>
  <tr>
      <td width=168> 
          <img src="kopek-1/Kopek (6).jpg">
          <br><br> 
          <img src="kopek-1/Kopek (7).jpg">
          <br><br> 
          <img src="kopek-1/Kopek (8).jpg">
          <br><br> 
          <img src="kopek-1/Kopek (9).jpg">
      </td>
      <td width=168> &nbsp; </td>
      <td width=130> &nbsp; </td>
      <td width=168> &nbsp; </td>
      <td width=168> &nbsp; </td>
  </tr>
  <tr>
      <td> &nbsp; </td>
      <td> &nbsp; </td>
      <td> &nbsp; </td>
      <td> &nbsp; </td>
      <td> &nbsp; </td>
  </tr>
</table>


Hayvan ResimleriKöpek Resimleri


 

  

   
 

 

 

 

 

 

  

 

 

 

 

 

     


<tr align=center> Bu koda dikkat etmenizi istiyorum; 
 
Birinci satırdaki 4 hücrenin içindekileri ortaya hizalamak için her <td> ye align=center ilave etmedik. 
Bunun yerine satıra (<tr align=center> ) hizalama özelliği verdiğimizde satırdakileri hizalamış olduk. 

Bu aşamada diğer 3 hücreye de resim ekledik. 
önceki sayfada olduğu gibi burada da; her hücreye eklediğimiz 4 resim genişlik yetmediğinden alt alta gelecekti. 
fakat biz bunu gözlemleyemedik çünkü zaten iki resim arasında <br> <br> kodları var. 
Siz resimler arasındaki br kodlarını kaldırıp olayı kendiniz gözlemleyebilirsiniz. 


...........................
.............................................
........................................................

<table border=1 align=center>
<tr align=center>
<td width=168> 
            <img src="kopek-1/Kopek (6).jpg">
            <br><br> 
            <img src="kopek-1/Kopek (7).jpg">
            <br><br> 
            <img src="kopek-1/Kopek (8).jpg">
            <br><br> 
            <img src="kopek-1/Kopek (9).jpg">
</td>
<td width=168> 
            <img src="kopek-1/Kopek (10).jpg">
            <br><br> 
            <img src="kopek-1/Kopek (11).jpg">
            <br><br> 
            <img src="kopek-1/Kopek (12).jpg">
            <br><br> 
            <img src="kopek-1/Kopek (13).jpg">
</td>
<td width=130>   </td>
<td width=168> 
            <img src="kopek-1/Kopek (14).jpg">
            <br><br> 
            <img src="kopek-1/Kopek (15).jpg">
            <br><br> 
            <img src="kopek-1/Kopek (16).jpg">
            <br><br> 
            <img src="kopek-1/Kopek (17).jpg">
</td>
<td width=168> 
            <img src="kopek-1/Kopek (18).jpg">
            <br><br> 
            <img src="kopek-1/Kopek (19).jpg">
            <br><br> 
            <img src="kopek-1/Kopek (20).jpg">
            <br><br> 
            <img src="kopek-1/Kopek (21).jpg">
</td>
</tr>
<tr>
            <td> &nbsp; </td>
            <td> &nbsp; </td>
            <td> &nbsp; </td>
            <td> &nbsp; </td>
            <td> &nbsp; </td>
</tr>
</table>


Hayvan ResimleriKöpek Resimleri


 

  

 

 

 

 

 

 

  Arı 
  Aslan 
  At 
  Ayı 
  Balık 
  Balina 
  Baykuş 
  Böcek 
  Bufalo 
  Çita 
  Deniz Ayısı 
  Denizanası 
  Devekuşu 
  Dinozor 
  Domuz 
  Ejderha 
  Fare 
  Fil 
  Flamingo 
  Fok 
  Gergedan 
 

 

 

 

 

 

     


Hayvan isimlerinin başında $amp;nbsp; var. 
 
nedeni de normal boşlukla baştan bir miktar uzaklaştıramayız; boşluk ihmal edilir. 
Birçok yerde &nbsp; bizim imdadımıza yetişir. 

Font etiketimizi hatırlayın. Yazılara büyüklük (size), renk (color), yazı şekli (face) vs.. vermek istediğimizde font etiketini kullanırız. 
Font etiketi de daha önceki söylediğimiz kurala uyuyor; önce açılan etiket önce kapanır. 
Font etiketinden önce <td> etiketi açılmış daha sonra <font> etiketi açılmış o yüzden öncelikli olarak 
Burada <font> etiketi kapanması gerekir. 
Eğer başka bir hücreye daha yazı yazarsak ve onunda aynı font özelliklerine sahip olmasını istersek ilgili hücrede font etiketini tekrar açıp kapatırız. 

.......................
....................................
...........................................

<td width=130> 
    <font size=3>
            &nbsp; Arı <br> 
            &nbsp; Aslan <br>
            &nbsp; At <br>
            &nbsp; Ayı <br>
            &nbsp; Balık <br>
            &nbsp; Balina <br> 
            &nbsp; Baykuş <br>
            &nbsp; Böcek <br>
            &nbsp; Bufalo <br>
            &nbsp; Çita <br>
            &nbsp; Deniz Ayısı <br> 
            &nbsp; Denizanası <br>
            &nbsp; Devekuşu <br>
            &nbsp; Dinozor <br>
            &nbsp; Domuz <br>
            &nbsp; Ejderha <br>
            &nbsp; Fare <br>
            &nbsp; Fil <br>
            &nbsp; Flamingo <br> 
            &nbsp; Fok <br>
            &nbsp; Gergedan <br> 
    </font>
</td>
.......................
....................................
...........................................

Hayvan ResimleriKöpek Resimleri


 

  

 

 

 

 

 

 

  Arı 
  Aslan 
  At 
  Ayı 
  Balık 
  Balina 
  Baykuş 
  Böcek 
  Bufalo 
  Çita 
  Deniz Ayısı 
  Denizanası 
  Devekuşu 
  Dinozor 
  Domuz 
  Ejderha 
  Fare 
  Fil 
  Flamingo 
  Fok 
  Gergedan 
 

 

 

 

 

 

     


Herşeyde olduğu gibi font etiketinde de varsayılan bir yazı tipi vardır (face). 
 
Biz hiçbir face belirtmeyip sadece font belirttik. Varsayılan yazı tipi (face) hoşumuza gitmedi ve değiştiriyoruz. 
Ben yazı tipi diyorum ama daha doğru ifadesi yazı fontudur. 
<font face="verdana" size=3> ifadesindeki verdana ile hayvan isimlerinin fontu değiştirilmiş oldu. 

<td width=130 align=left valign=top> bu satıra da align ve valign ekledik. 
Yazı yazdığımız hücre de yatay hizalama (align) değerini tr ye verdiğimiz ortalı (center) ifadesinden alıyordu. 

Bir hücrenin dikey hizalamasının nasıl olacağı söylenmediyse varsayılan hizalama middle dır. 
Biz burada valign=top ile hücrenin en üstünden hizalamaya başladık hücre içindeki boşluk yazılardan sonraya kaydı. 

.......................
....................................
...........................................

<td width=130 align=left valign=top> 
    <font face="verdana" size=3>
            &nbsp; Arı <br> 
            &nbsp; Aslan <br>
            &nbsp; At <br>
            &nbsp; Ayı <br>
            &nbsp; Balık <br>
            &nbsp; Balina <br> 
            &nbsp; Baykuş <br>
            &nbsp; Böcek <br>
            &nbsp; Bufalo <br>
            &nbsp; Çita <br>
            &nbsp; Deniz Ayısı <br> 
            &nbsp; Denizanası <br>
            &nbsp; Devekuşu <br>
            &nbsp; Dinozor <br>
            &nbsp; Domuz <br>
            &nbsp; Ejderha <br>
            &nbsp; Fare <br>
            &nbsp; Fil <br>
            &nbsp; Flamingo <br> 
            &nbsp; Fok <br>
            &nbsp; Gergedan <br> 
    </font>
</td>
.......................
....................................
...........................................

Hayvan ResimleriKöpek Resimleri


 

  

 

 

 

 

 

 

  Arı 
  Aslan 
  At 
  Ayı 
  Balık 
  Balina 
  Baykuş 
  Böcek 
  Bufalo 
  Çita 
  Deniz Ayısı 
  Denizanası 
  Devekuşu 
  Dinozor 
  Domuz 
  Ejderha 
  Fare 
  Fil 
  Flamingo 
  Fok 
  Gergedan 
 

 

 

 

 

 

  Geyik 
  Hampster 
  Hindi 
  Iguana 
  İnek 
  Jaguar 
  Kanguru 
  Kaplan 
  Kaplumbağa 
  Kartal 
  Kaz 
  Keçi 
  Kedi 
  Kertenkele 
  Kirpi 
  Koala 
  Kelebek 
  Koyun 
  Köpek 
  Köpek Balığı 
  Kuğu 
  Kurbağa 
   


Hayvan Resimleri / Köpek ResimleriSayfa     1   2   3


 Diğer hayvan isimlerini de 2. satırdaki 5 hücreye yazacağız. 
En üstte uyguladığımız <hr> ifadesiyle çizgi çizmeyi tekrar kullandık. 
Dediğim gibi align (yatay hizalama), color (renk), width (genişlik) özellikleri birçok html etiketinde kullanılır ve br etiketini bu özellikleriyle kullandık. 
web tasarımı öğrenmekten çok daha zevkli olan birşey var o da web sitesi yapmak. 
Hayvan Resimleri sitesini yaparken sizinle bu bilgileri paylaşmak ve sizlerin de ileride böyle siteler yapacağınızı düşünmek beni mutlu ediyor. 
Sitedeki sayfalara bakarken boş bir yere sağ tıklayıp kaynağı görüntüle (view source) seçip html kodlarını inceleyebilirsiniz. 
Selametle kalın. 

Hayvan ResimleriKöpek Resimleri


 

  

 

 

 

 

 

 

  Arı 
  Aslan 
  At 
  Ayı 
  Balık 
  Balina 
  Baykuş 
  Böcek 
  Bufalo 
  Çita 
  Deniz Ayısı 
  Denizanası 
  Devekuşu 
  Dinozor 
  Domuz 
  Ejderha 
  Fare 
  Fil 
  Flamingo 
  Fok 
  Gergedan 
 

 

 

 

 

 

  Geyik 
  Hampster 
  Hindi 
  Iguana 
  İnek 
  Jaguar 
  Kanguru 
  Kaplan 
  Kaplumbağa 
  Kartal 
  Kaz 
  Keçi 
  Kedi 
  Kertenkele 
  Kirpi 
  Koala 
  Kelebek 
  Koyun 
  Köpek 
  Köpek Balığı 
  Kuğu 
  Kurbağa 
  Koyun 
  Köpek 
  Köpek Balığı 
  Kuğu 
  Kurbağa 
  Kurt 
  Kuş 
  Lama 
  Lemur 
  Leopar 
  Maymun 
  Ördek 
  Örümcek 
  Panda 
  Panter 
  Papağan 
  Pelikan 
  Penguen 
  Rakun 
  Sincap 
  Sinek Kuşu 
  Tarantula 
  Tavşan 
  Tavuk 
  Tilki 
  Timsah 
  Yarasa 
  Yavru Kuzu 
  Yılan 
  Yunus 
  Zebra 
  Zürafa 


Hayvan Resimleri / Köpek ResimleriSayfa     1   2   3