Ders 4 : a, pre, details Tagları - HTML Dersleri

<a> tagı, href özelliği ile belirtilen adrese link vermekte kullanılır. a tagına href özelliğinden başka download (belirtilen dosyanın yazıya tıklandığında indirilmesi için), hreflang (bu özellik ile linkin dili belirtilebilir), media (href ile belirtilen linkin hangi aygıt/medya için veya hangi sebeple --yazdırma, okuma, projektör vb.-- özelleştirileceğini belirtmekte kullanılır), type (linkin MIME tipini belirtmekte kullanılır), rel (link ile bulunduğu sayfanın arasındaki durumu belirtmekte kullanılır), target (_blank, _top, _self, _parent veya çerçeve --frame-- ismi değer olarak atanabilir. Belirtilen değer ile linkin nasıl açılacağı bildirilmiş olunur. Örneğin _blank ile link yeni bir sayfada açılır.) özellikleri atanabilir.

<details> tagı, üzerine tıklandığında görüntülenecek bilgileri açıp kapamakta kullanılabilir. open özelliği (true veya false olarak ayarlanabilir, true değeri atanırsa veya değer atanmazsa açık olarak görüntülenecektir) verilmediği sürece bilgi öntanımlı olarak tıklanmadığı sürece gizli kalacaktır. <details> tagı içerisinde bulunan <summary> tagı ile başlık bilgisi belirlenebilir. (details tagı Internet Explorer / Edge tarayıcılarında desteklenmemektedir)

<pre> tagı, yazıları önformatlı olduğu şekilde gösterir. Özellikle cep-tablet uyumunu sağlayan CSS kodlarıyla kullanıldığında çok faydalı bir tagdır. CSS kullanımı konusuna önümüzdeki derste değineceğiz. Bu derste sadece bu uyumu sağlayan CSS kodlarını vermekle yetineceğiz.

Yazımızın sonlarında paylaştığımız zip dosyasını indirerek 004.html kodlarını inceleyebilirsiniz.

<a> tagının örnek kullanımları:

<a href="https://www.fullportal.org">www.fullportal.org</a>
<a href="https://www.fullportal.org" target="_blank">www.fullportal.org</a>
<a href="https://www.fullportal.org" hreflang="tr">www.fullportal.org</a>
<a href="./ders003.html">www.fullportal.org</a> (Aynı dizinde bulunan dosyaya link verilirken)



<details> tagının örnek kullanımları:

<details> <summary>Yazı Başlığı</summary> Bu bilgi başlığa tıkladığınızda görüntülenmektedir. </details>
<details open="true"> <summary>Yazı Başlığı</summary> Bu bilgi open özelliği verildiğinden öntanımlı olarak görüntülenmektedir. </details>


<pre> tagının örnek kullanımı:

<pre>
pre tagı ile boşluklar olduğu gibi görüntülenecektir. (Yazının fontu ve büyüklüğü standart olacaktır, özel olarak tanım yapılmadığı sürece. Yazının fontu ve büyüklüğü CSS ile tanımlanabilir.) style tagları ile cep telefonu ve tablet uyumu sağlanabilir:
<style>
pre { white-space: pre-wrap;}
pre { font-family: monospace;}
* { font-size: 1em; }
</style>
</pre>



Yorum Satırları

<!-- Bu satır tarayıcınız tarafından yorum olarak değerlendirilecektir.
Bu satır da. -->





Bu dersimizde ek bilgi olarak HTML üzerinde yorum yapmak için kullanacağınız <!-- ile --> işaretlerinden bahsedelim. Bu iki işaret kalan kısım tarayıcınız tarafından yorum olarak değerlendirilecek ve işleme tabi tutulmayacaktır. Sayfanın kaynak koduna baktığınızda bu yorum satırlarını görebileceksiniz. Kaynak koda bilgi notları eklemek için faydalanabilirsiniz.

HTML'nin doğal programlama dili olan javascript kullandığınızda ise // işaretinden (bu işaretten sonraki aynı satırdaki kısım yorum olarak değerlendirilir) veya /* ile */ işaretlerinden (bu iki işaret arasına yazılanlar yorum olarak değerlendirilir) faydalanılabilir. Javascipt kodları <script> tagı kullanılarak yazılır. <noscript> tagı sayfa scriptleri çalıştırmıyorsa gösterilecek bilgi notunu belirtmemize yarar. <script> tagının src özelliğine atama yapılarak dışarıdan bir javascript dosyası da sayfada çalıştırılabilir. Ayrıca type özelliği ile betik (script) tipi (text/javascript veya text/ecmascript gibi) belirtilebilir, charset özelliği ile dışarıdan dahil edilen dosyanın karakter kodlama şekli bildirilebilir, async özelliği ile harici dosyalar için eşzamanlı çalışmama durumu bildirilir (sayfanın gövdelemesi --parsing-- devam ederken betik çalıştırılır), defer özelliği ile harici dosyalar için betiğin sayfanın gövdelemesi (parsing) tamamlandıktan sonra çalışması bildirilir. async ve defer özellikleri verilmezse, betik hemen çalıştırılacaktır.

4. dersimizin dosyasını indirmek için tıklayınız.





Yazı tarihi:



Bu yazı GNU GENEL KAMU LİSANSI v3 ile lisanslandırılmıştır. Lisansı muhafaza etmek kaydı ile dilediğiniz şekilde kopyalayabilir, dağıtabilir ve değiştirebilirsiniz.





ANA SAYFA WEB TASARIM HTML