HTML'de Dosya Yolları | PROTOTURK

  • Anasayfa
  • Akış
  • Keşfet
  • Makaleler
  • Soru & Cevap
  • Ders İstekleri YENİ
  • HTML
  • CSS
  • Javascript
  • Group Created with Sketch. PHP
  • MySQL
  • Laravel
  • Python
  • Git
Uygulamayı Yükle
HTML Dersleri
  • Başlangıç
  • Temeller
  • Etiketler
  • Nitelikler
  • Başlık Etiketleri
  • Paragraf Etiketleri
  • Metin Biçimlendirme Etiketleri
  • Alıntı Etiketleri
  • Yorum Satırları
  • Bağlantılar (Linkler)
  • Görüntüler (Resimler)
  • Tablolar
  • Listeler
  • Görüntüleme Değerleri
  • ID ve Class
  • Iframe (Çerçeve)
  • Dosya Yolları
  • Üst Bilgiler (Metadata)
  • Kod Etiketleri
  • Özel Karakterler
Formlar
  • Form Kullanımı
  • Form Etiketleri
  • Input Tipleri
HTML5
  • HTML5'e Giriş
  • HTML5 Tarayıcı Desteği
  • HTML5 Video
API
  • Geolocation (Konum) API
Etiketler
  • <!-- ... --->
  • <!DOCTYPE>
  • <a>
  • <abbr>
  • <article>
  • <aside>
  • <b>
  • <base>
  • <bdi>
  • <bdo>
  • <blockquote>
  • <body>
  • <br>
  • <button>
  • <div>
  • <html>
  • <i>
  • <img>
  • <label>
  • <ol>
  • <p>
  • <q>
  • <s>
  • <style>
  • <title>
  • Kategoriler
  • Başlıklar
    • HTML'de Dosya Yolları
    • HTML'de Varsayılan Yolu Belirlemek
  • Paylaş
    • Paylaş
    • Tweetle
    • Gönder

HTML'de Dosya Yolları

Bu konu aslında önemsiz gibi gözüksede HTML derslerine yeni başlamış kişiler genelde resim falan göstermek istediklerinde şöyle bir yol veriyorlar;

<img src="C:\Users\test\Desktop\a.png">Editörde Görüntüle

Bu mantıkta sunucuya attıklarında çalışacaklarını düşünüyorlar ancak yanılıyorlar. Dosya yollarını verirken şu şekilde verebiliriz;

Dosya Yolu Açıklaması
<img src="resim.jpg"> Mevcut klasör ile aynı yerde bulunan resim.jpg dosyasını çağırır.
<img src="img/resim.jpg"> Mevcut klasörün altında bulunan img klasörü içerisindeki resim.jpg dosyasını çağırır.
<img src="/img/resim.jpg"> Ana klasörün altındaki img klasörü içerisindeki resim.jpg dosyasını çağırır. Bir üsttekinden farkı eğer başına / geliyorsa bu ana dizini temsil ediyordur. Örneğin bu sitenin ana dizini https://prototurk.com'dur yani /img/test.jpg dersem aslında şu demek oluyor https://prototurk.com/img/test.jpg
<img src="../resim.jpg"> Mevcut klasörün bir üst klasöründe bulunan resim.jpg dosyasını çağırır.
<img src="https://prototurk.com/resim.jpg"> Bu ise verilecek en net yoldur ancak gereksiz uzundur bunun aslında birebir aynısı /resim.jpg buna eşittir.

HTML'de dosya yollarını genelde şunlar için belirleme ihtiyacı duyuyoruz;

  • HTML sayfaları
  • Görseller
  • CSS Dosyaları
  • JavaScript Dosyaları
  • vb.

HTML'de Varsayılan Yolu Belirlemek

HTML'de varsayılan yolu belirlemek için <base> etiketi kullanılır. Ve kodlarımızda <head> etiketi içerisine yazılır. Örnek vermek gerekirse;

<head> .. <base href="https://prototurk.com"> .. </head>Editörde Görüntüle

Bunu yaptıktan sonra artık ben <img src="upload/img/resim.jpg"> şeklinde kullanırsam aslında şu şekilde yorumlanacak bu; <img src="https://prototurk.com/upload/img/resim.jpg">

Yani kesinlik vermek adına bu etiketi sayfalarımızda kullanabiliriz. Şu an kendi bilgisayarınızda çalışıyor olabilirsiniz ancak ilerleyen süreçte kendinize bir hosting ya da sunucu almanız gerekecek ki yaptığınız web sayfalarını yayınlayabilin. İşte o gibi durumlarda bu etiket işinize yarayacaktır. Şu an bu sitenin kaynak kodlarına bakarsanız aynı kodu görürsünüz. Kaynağı görüntülemek için Windows'ta CTRL + U, macOs'ta command + option + u kombinasyonunu kullanabilirsiniz.

tayfunerbilen 2412 gün önce yazdı - 22424 kez görüntülendi. Önceki Iframe (Çerçeve) Sonraki Üst Bilgiler (Metadata)

Từ khóa » Html Başka Klasöre Link Verme