• 0

Bilmediğiniz 7 Kullanışlı HTML Özellikleri

4 hafta önce , Okuma süresi 2 dakika.

Bilmediğiniz 7 Kullanışlı HTML Özellikleri

HTML, web geliştirmenin en  temel taşlarından biridir. Yine de, birçok hevesli programcı, yalnızca yüzeyi gözden geçirir ve tüm potansiyelini kaçırarak CSS, JS, vb.'ye geçer.

Bu, birçok yeni başlayanın bilmediği ancak yardımcı olabilecek HTML özelliklerinin bir listesidir.

1) Çoklu

 
multipleÖzelliği, kullanıcının bir de birden fazla değer girmesi için izin verir <input>. Dosya veya e-posta giriş türleri ve <select>öğe için geçerli bir boole niteliğidir .

Bir e-posta girişi için, yalnızca çoklu öznitelik belirtilmişse, değer virgülle ayrılmış e-posta adreslerinin bir listesi olabilir. Listedeki her bir adresteki boşluklar kaldırılır.

Bir dosya girişi için, kullanıcı her zamanki gibi (Shift veya Crtl tuşunu basılı tutarak) birden fazla dosya seçebilir.

<input type="file" multiple>
 

 

2) Kabul et

 
<input>Eleman vardır acceptEğer kullanıcı yükleyebileceğiniz dosya türlerini belirlemenizi sağlar niteliğini.

Benzersiz dosya türü belirteçlerinin virgülle ayrılmış bir listesini içeren bir dize iletmeniz gerekir.

Yalnızca ses, görüntü veya video biçimini belirtmek için de kullanabilirsiniz.

<input type="file" accept=".png, .jpg">
 

 

3) İçerikDüzenlenebilir

 
contenteditableHTML içeriğini kullanıcı tarafından düzenlenebilir veya düzenlenemez yapan genel bir niteliktir (tüm HTML öğelerinde ortaktır). Ancak, DOM içeriğine karşı yalnızca görünür içerikte yapılan değişikliklere dikkat edin.

<div contenteditable="true">I'm a cool editable div ;)</div>

4) Yazım denetimi

 
Bu spellcheck, giriş alanları ve diğer düzenlenebilir öğeler gibi HTML öğelerinde yazım ve dilbilgisini denetlemek için kullanabileceğiniz başka bir genel niteliktir.

Not: Yazım denetimi özelliği true olarak ayarlansa ve tarayıcı yazım denetimini desteklese bile, genellikle düzenlenemeyen öğeler yazım hatalarına karşı denetlenmez.

<p contenteditable="true" spellcheck="true">
Thanks furr checkinng my speling :)</p>


5) Çevir

 
translate tarayıcıya içeriğin çevrilmesi gerekip gerekmediğini söyler.

Örneğin, Google Çeviri'nin şirketinizin veya markanızın adını otomatik olarak çevirmeye çalışmasını önlemek için kullanabilirsiniz.

<footer><p translate="no">LearnPine</p></footer>

6) Afiş

 
posterVideo indirilirken veya kullanıcı oynat düğmesine basana kadar gösterilecek bir resmi belirtmek için özniteliği kullanın .

Resim belirtilmezse, ilk kare mevcut olana kadar hiçbir şey görüntülenmez, ardından ilk kare poster çerçevesi olarak gösterilir.

<video controls 
src="https://bit.ly/3nWh78w"
poster="posterImage.png">
</video>

7) İndir

 
Tarayıcılara bir URL'ye gitmek yerine bir URL'yi indirme talimatı vermek için downloadbir <a>öğeyle birleştirilmiş özniteliği kullanın , böylece kullanıcıdan onu yerel bir dosya olarak kaydetmesi istenir.

Dosya adını da belirtebilirsiniz.

<a href="index.html" download="fileName">Download me :)</a>
 

 

#Yazılım #html