HTML Button Etiketi ile html belgenizde kullanıcılardan veri alabilir, özelleştirerek kullanıcıları doğru bir şekilde yönlendirebilirsiniz.
HTML Button Etiketi. Tıklanabilir bir düğme şu şekilde işaretlenir:
See the Pen Armyyazılım buton etiketi by ArmyYazılım (@armyyazilim) on CodePen.
HTML Button Etiketi Tanım ve Kullanım
<button>Etiket tıklanabilir bir düğme tanımlar.
Bir <button>öğenin içine metin (ve <i>, <strong>, <br>, <img> vb. Etiketler) koyabilirsiniz. Bu, <input> öğesi ile oluşturulmuş bir düğme ile mümkün değildir !
İpucu:<button> Tarayıcılara ne tür bir düğme olduğunu söylemek için her zaman bir öğenin type özniteliğini belirtin .
İpucu: CSS ile düğmeleri kolayca biçimlendirebilirsiniz! Aşağıdaki örneklere bakın.
İki Tür Tanımlanır
Birinci tanım button etiketi ile ikincisi input etiketiyle tanımlanır. İkisininde kullanımı aşağıdaki gibidir.
See the Pen input button armyyazılım by ArmyYazılım (@armyyazilim) on CodePen.
Burada dikkat etmeniz gereken nokta: input ile kullanıldığında kapatma etiketinin olmaması ve butonun ismini yazdığımız yerin değişik olması.
HTML Button Etiketi Öznitellikleri
| Öznitelik | Değer | Açıklama |
|---|---|---|
| autofocus | autofocus | Sayfa yüklendiğinde bir düğmenin otomatik olarak odaklanması gerektiğini belirtir |
| disabled | disabled | Bir düğmenin devre dışı bırakılması gerektiğini belirtir |
| form | form_id | Düğmenin hangi forma ait olduğunu belirtir |
| formaction | URL | Bir form gönderildiğinde form verilerinin nereye gönderileceğini belirtir. Yalnızca type = ”submit” için |
| formenctype | application/x-www-form-urlencoded multipart/form-data text/plain | Form verilerinin sunucuya gönderilmeden önce nasıl kodlanması gerektiğini belirtir. Yalnızca type = ”submit” için |
| formmethod | get post | Form verilerinin nasıl gönderileceğini belirtir (hangi HTTP yönteminin kullanılacağı). Yalnızca type = ”submit” için |
| formnovalidate | formnovalidate | Form verilerinin gönderim sırasında doğrulanmaması gerektiğini belirtir. Yalnızca type = ”submit” için |
| formtarget | _blank _self _parent _top framename | Formu gönderdikten sonra yanıtın nerede görüntüleneceğini belirtir. Yalnızca type = ”submit” için |
| name | name | Düğme için bir isim belirtir |
| type | button reset submit | Düğme türünü belirtir |
| value | text | Düğme için bir başlangıç değeri belirtir |
Stil vererek butonlarımızı özelleştirebiliriz.
See the Pen armyyazılım buton özelleştirme by ArmyYazılım (@armyyazilim) on CodePen.
Daha efektif butonlar tasarlayabilirsiniz.
See the Pen Armyyazılım buton özelleştirme 2 by ArmyYazılım (@armyyazilim) on CodePen.
Armyyazılım.com | İbrahim BOZKURT
Herhangi bir sorunuz ve öneriniz varsa, yorumlar kısmında bize bildirin!Eğer yazılım ile ilgileniyorsanız sizde bizlere katılıp makaleler yazabilir video içerikler üretebilirsiniz. Sizlerle birlikte bizde büyük bir ekip olabiliriz.
Ayrıca İnstagram hesabımızı takip edebilir bize Twitter ’dan da yazabilirsiniz.
Bu platformlardan herhangi birinde hsabınız yok ise telaşa gerek yok. İstediğiniz soruyu yorumlarda belirtebilirsiniz.
İlginizi çekebilir…
Tüm HTML Kodları ve Açıklamaları!
Bu makaleyi beğendiyseniz, lütfen WordPress video eğiticileri için YouTube Kanalımıza abone olun . Bizi Twitter ve İnstagram‘da da bulabilirsiniz…
JavaScript Değişkenler (Variables) Nedir ve Nasıl Kullanılır?
JAVASCRİPT ve JQUERY
JavaScript Tek Satırlı ve Çok Satırlı Yorum Satırı Nasıl Kullanılır?
JAVASCRİPT ve JQUERY
JavaScript Statements, Değişkenler, Eşitlikler Nedir ve Nasıl Kullanılır?
JAVASCRİPT ve JQUERY
Bir cevap yazın