HTML formu bir HTML belgesinin bazı bilgileri dış dünyada önceden belirlenmiş bir noktaya gönderebildiği ve bilgilerin bir şekilde işleneceği bir araçtır.

HTML Dersinde formlardan bahsetmek zordur. Bunun nedeni çok basit: Bir HTML formu oluşturmak, bir HTML formunun bilgi göndereceği bir "dış nokta" oluşturmaktan çok daha kolaydır. Çoğu durumda böyle bir "nokta" Pearl veya C ile yazılmış bir programdır.

Formlar tarafından gönderilen verileri işleyen programlara genellikle CGI komut dosyaları denir. CGI kısaltması, Ortak Ağ Geçitleri Arayüzü anlamına gelir. Çoğu durumda CGI betikleri yazmak, ilgili programlama dili ve özellikleri hakkında iyi bilgi sahibi olmayı gerektirir. işletim sistemi Unix.

Şu anda, PHP/FI dili, talimatları doğrudan HTML belgelerine gömülebilen bir miktar dağıtım almıştır (belgeler *.pht veya *.php uzantılı dosyalar olarak kaydedilir).

HTML formları, bilgileri işleme programlarına [değişken adı]=[değişken değeri] çiftleri biçiminde iletir. Değişken isimleri verilmeli Latin harfleriyle. Değişken değerler, yalnızca sayı içerseler bile işleyiciler tarafından dize olarak değerlendirilir.

HTML formu nasıl çalışır?

Form bir etiketle açılır ve etiketiyle bitiyor

Etiket

Düğme üzerine basılan yazı, gerekirse düğme tanımına NAME=[name] (İngilizce "ad"dan "name" olarak okunur) özelliği eklenerek işleyiciye aktarılabilir, örneğin:

Böyle bir düğmeye tıkladığınızda, işleyici, diğer tüm verilerle birlikte, Let's go! değerine sahip düğme değişkenini de alacaktır. .

Bir formda farklı adlara ve/veya değerlere sahip birden fazla gönder düğmesi bulunabilir. Dolayısıyla işleyici, kullanıcının hangi gönder düğmesine bastığına bağlı olarak farklı davranabilir.

Bir HTML formu verileri nasıl toplar?

Başka türde elementler de var . Her öğe öğenin adını (ve buna göre işleyiciye aktarılacak değişkenin adını) tanımlayan NAME=[name] niteliğini içermelidir. İsim verilmeli sadece latin harflerle. Çoğu öğe VALUE="[value] özelliğini içermelidir" , определяющий значение, которое будет передано обработчику под этим именем. Для элементов !} Ve ancak ilgili değişkenin değeri kullanıcı tarafından klavyeden girilebildiğinden bu öznitelik gerekli değildir.

Temel eleman türleri :

TÜR=metin

Bir metin satırı girmek için bir pencere belirtir. SIZE=[sayı] (karakter cinsinden giriş penceresinin genişliği) ve MAXLENGTH=[sayı] (karakter cinsinden giriş dizesinin izin verilen maksimum uzunluğu) ek niteliklerini içerebilir.

Örnek:

Metin girmek için 20 karakter genişliğinde bir pencere belirtir. Varsayılan olarak pencere, kullanıcının düzenleyebileceği Ivan metnini içerir. Düzenlenen (veya düzenlenmeyen) metin, kullanıcı değişkenindeki işleyiciye iletilir.

TÜR=şifre

Parola girmek için bir pencere tanımlar. Kesinlikle metin türüne benzer, ancak giriş metninin karakterleri yerine ekranda yıldız işaretleri (*) gösterilir. Örnek:

Parola girmek için 20 karakter genişliğinde bir pencere belirtir. İzin verilen maksimum şifre uzunluğu 10 karakterdir. Girilen şifre pw değişkenindeki işleyiciye iletilir.

TİP=radyo

Bir radyo düğmesini tanımlar. İsteğe bağlı bir işaretli öznitelik içerebilir (düğmenin işaretli olduğunu gösterir). Aynı ada sahip bir grup radyo düğmesi yalnızca bir etiketli radyo düğmesine sahip olabilir.

Örnek:

9600 bps
14400 bps
28800 bps

9600 bps, 14400 bps ve 28800 bps etiketli üç radyo düğmesinden oluşan bir grubu belirtir. Başlangıçta düğmelerden ilki etiketlenmiştir. Kullanıcı başka bir düğmeyi işaretlemezse, 9600 değerine sahip modem değişkeni işleyiciye iletilecektir. Kullanıcı başka bir düğmeyi işaretlerse, işleyiciye 14400 veya 28800 değeriyle modem değişkeni iletilecektir.

TÜR=onay kutusu

İşaretlenecek kareyi belirtir. İsteğe bağlı bir işaretli öznitelik içerebilir (karenin işaretli olduğunu gösterir). Radyo düğmelerinden farklı olarak, aynı ada sahip bir kareler grubunun birden fazla etiketli karesi olabilir.

Örnek:

Kişisel bilgisayarlar
İş istasyonları
Sunucular yerel ağlar
İnternet sunucuları

Dört kareden oluşan bir grubu tanımlar. Başlangıçta ikinci ve dördüncü kareler işaretlenir. Kullanıcı herhangi bir değişiklik yapmazsa işleyiciye iki değişken iletilecektir: comp=WS ve comp=IS.

TÜR=gizli

Tanımlar gizli öğe formu doldururken kullanıcının göremediği ve işleyiciye değiştirilmeden aktarılan veriler. İşleyicinin formun hangi sürümüyle uğraştığını bilmesi için böyle bir öğenin zaman zaman geri dönüştürülen bir formda olması bazen yararlı olabilir. Kendi başınıza düşünebileceğiniz diğer olası kullanım durumları.

Örnek:

İşleyiciye 1.1 değeriyle aktarılan version gizli değişkenini tanımlar.

TİP=sıfırla

Tıklandığında HTML formunu döndüren bir düğmeyi tanımlar. başlangıç ​​durumu. Bu düğmeyi kullanırken işleyiciye hiçbir veri aktarılmadığından, reset türündeki bir düğmenin name özelliği olmayabilir.

Örnek:

Tıklandığında HTML formunu orijinal durumuna döndüren Form Alanlarını Temizle düğmesini tanımlar.

Elementlerin ötesinde , HTML formları menüler içerebilir ve metin giriş alanları .</p> <p>Menü <SELECT>n elemanın sayısı şuna benzer:</p><p> <SELECT NAME="[имя]"> <OPTION VALUE="[değer 1]">[Metin 1] <OPTION VALUE="[değer 2]">[metin 2] ... <OPTION VALUE="[n-değeri]">[metin n]</SELECT> </p><p>Gördüğünüz gibi menü etiketiyle başlıyor <SELECT>ve etiketiyle bitiyor</SELECT>. Etiket <SELECT>Menünün oluşturduğu değişkenin adını belirten gerekli NAME özelliğini içerir.</p> <p>Etiket <SELECT>MULTIPLE niteliğini de içerebilir; bunun varlığı, menüden birden fazla öğenin seçilebileceğini gösterir. Çoğu tarayıcı bir menü gösterir <SELECT MULTIPLE>menü öğelerinin yer aldığı bir pencere biçimindedir (pencerenin satırlardaki yüksekliği SIZE=[sayı] özelliği ile ayarlanabilir). Menü <SELECT>çoğu durumda açılır menü olarak gösterilir.</p> <p>Etiket <OPTION>bir menü öğesini tanımlar. Gerekli VALUE özelliği, bu menü öğesinin seçilmesi durumunda işleyiciye aktarılacak değeri ayarlar. Etiket <OPTION>öğenin varsayılan olarak işaretlendiğini belirten işaretli bir öznitelik içerebilir.</p> <h3>Küçük bir örnek verelim:</h3> <SELECT NAME="selection"> <OPTION VALUE="seçenek 1" checked>seçenek 1 <OPTION VALUE="seçenek 2">seçenek 2 <OPTION VALUE="seçenek3">Seçenek 3</SELECT> <p>Böyle bir parça, üç öğeden oluşan bir menüyü tanımlar: Seçenek 1, Seçenek 2 ve Seçenek 3. Seçenek 1 varsayılan olarak seçilidir. İşleyiciye, değeri seçenek1 (varsayılan), seçenek2 veya seçenek3 olabilen bir seçim değişkeni aktarılacaktır.</p> <p>Zaten öğrendiklerimizden sonra element <TEXTAREA>oldukça basit görünebilir. Örneğin:</p><p> <TEXTAREA NAME=address ROWS=5 COLS=50>İşte adresiniz...

Tüm özellikler gereklidir. NAME özelliği, pencerenin içeriğinin işleyiciye (örnekte - adres) aktarılacağı adı tanımlar. ROWS özelliği pencerenin yüksekliğini satır cinsinden ayarlar (örnekte 5). COLS özelliği pencerenin genişliğini karakter cinsinden ayarlar (örnekte 50).

Etiketler arasına yerleştirilen metin Ve, varsayılan olarak pencerenin içeriğini temsil eder. Kullanıcı onu düzenleyebilir veya basitçe silebilir.

Penceredeki Rusça harflerin olduğunu bilmek önemlidir. işleyiciye aktarıldığında karşılık gelen karakter nesnelerine dönüştürülebilirler.</p> <h3>Örnek:</h3> <p>HTML formlarının kullanımını göstermek için küçük bir PHP programı yazdım; bu program şu adreste yer alıyor:</p><p>http://206.31.82.215/hp/nc/fd-win.pht</p><p>Örnek 12'de açıklanan form, ilk verileri bu programa aktaracaktır:</p><p> <HTML> <HEAD> <TITLE>Örnek 12</TITLE> </HEAD> <H1>Biraz daha karmaşık bir form</H1> <FORM ACTION="http://206.31.82.215/hp/nc/fd-win.pht" METHOD=post> <H2>Bize biraz kendinizden bahsedin...</H2> <P>Gerçek verileri sağlamak gerekli değildir. Kurgusal olanlar gösteri amaçları için oldukça uygundur.</P> <P>İsim: <INPUT TYPE=text SIZE=40 NAME=fn><BR>Soyadı: <INPUT TYPE=text SIZE=40 NAME=ln><BR>Zemin: <INPUT TYPE=radio NAME=gender VALUE="erkek" checked>erkek <INPUT TYPE=radio NAME=gender VALUE="dişi">kadınsı <BR>Yaş: <INPUT TYPE=text SIZE=5 NAME=age>yıllar <BR> <INPUT TYPE=submit VALUE="İşleyiciyi Çalıştır"></P> </FORM> </BODY> </HTML> </p><p>HTML formunu doldurun, düğmeye tıklayın ve ne olacağını görün...</p> <p><b>Küçük numara <br>veya formun postayla nasıl gönderileceği</b></p><p>Şüpheciler tüm bunların iyi olduğunu söyleyecektir, ancak neden onları işleyecek hiçbir şeyi olmayan insanlar HTML formlarına ihtiyaç duysun? Bu kısmen doğrudur, ancak yalnızca kısmen.</p> <p>HTML, form içeriğini e-posta yoluyla göndermek için oldukça güçlü bir mekanizma sağlar. İşte pratikte nasıl göründüğü.</p> <p>Örnek 12'yi biraz değiştirdiğimizi varsayalım. Satır yerine</p><p> <FORM ACTION="http://206.31.82.215/hp/nc/fd-win.pht" METHOD=post> </p><p>sıraya girdik</p><p> <FORM ACTION="mailto:user@mail.box" ENCTYPE=text/plain> </p><p>Lütfen kodlama algoritmasını text/plain olarak değiştirdiğimizi, yani kodlamayı tamamen kapattığımızı unutmayın.</p> <p>Şimdi kullanıcının Ivan adını, Petrov soyadını, erkek cinsiyetini ve 22 yaşını belirttiğini varsayalım. Şimdi soru şu: Kullanıcı Çalıştırma işleyicisi düğmesine tıklarsa ne olur?</p> <p>Cevap basit. Aşağıdaki içeriğe sahip bir e-posta otomatik olarak user@mail.box adresine gönderilecektir:</p><p>Fn=Ivan ln=Petrov cinsiyeti=erkek yaşı=22</p><p>Maalesef tüm kullanıcılar bu HTML formunu kullanamayacaktır. Gerçek şu ki, mesajın oluşturulması ve onu göndermek için posta programının başlatılmasıyla ilgili tüm çalışmalar aslında kullanıcının tarayıcısı tarafından üstleniliyor. Bu, bir kullanıcının İnternet'e erişiminin yapılandırılmasının, hiper metin aktarım protokolünün ve giden posta dağıtım protokolünün eşzamanlı çalışmasını sağlaması gerektiği anlamına gelir. Bu her zaman mümkün değil. Ancak bu mümkün olmasa bile ölümcül bir şey olmayacaktır. Tarayıcı size sadece bir hata mesajı verecektir.</p> <table width="635" border="0"><tr><td width="200"> </td><td> </td><td width="200"> </td> </tr></table> <p>Çoğu zaman Web sitelerinde, üzerlerine HTML formları yerleştirilmiş sayfalar bulabilirsiniz. Web Formları - <a href="https://periscopes.ru/tr/kak-popolnit-balans-vkontakte-popolnenie-scheta-v-vk-udobnye-sposoby.html">uygun yol</a> sitenizi ziyaret edenlerden bilgi almak. Bunun bir örneği, ziyaretçilere ve site geliştiricilerine geri bildirim sağlayan -, -'dir. Formlar ayrıca site geliştiricileri için bir CMS geliştirirken de kullanışlıdır; bu, sitenin ana özelliği olan alaka düzeyini korumanıza olanak tanır. Bu makale, HTML formları oluşturmanın temellerine, bunların işlenmesine ve verilerin ekrandaki formlardan PHP komut dosyalarına nasıl aktarılacağına odaklanmaktadır.</p> <h2>1) Basit bir form oluşturmak</h2> <p>Etiketler <i><form> </i> Ve <i></form> </i> formun başlangıcını ve sonunu ayarlayın. Form başlangıç ​​etiketi <i><form> </i> iki nitelik içerir: <i>aksiyon</i> Ve <i>yöntem</i>. Action özelliği, betiği işlemek için çağrılması gereken betiğin URL'sini içerir. Bağlanmak <i>yöntem</i> tarayıcıya hangi görünümün görüntüleneceğini söyler <a href="https://periscopes.ru/tr/connection-closed-v-pubg-chto-delat-s-etoi-oshibkoi-http-zaprosy-my-vse.html">HTTP isteği</a> formu göndermek için kullanılmalıdır; olası değerler <i>POSTALAMAK</i> Ve <i>ELDE ETMEK</i>.</p> <h2>Yorum</h2> <p>POST ve GET yöntemleri arasındaki temel fark, bilginin aktarılma şeklidir. GET yönteminde parametreler aracılığıyla iletilir. <a href="https://periscopes.ru/tr/kak-v-firefox-peremestit-vkladki-vniz-pod-adresnuyu-stroku-kak.html">adres çubuğu</a> yani aslında isteğin HTTP başlığında, POST yönteminde ise parametreler HTTP isteğinin gövdesinden geçirilir ve hiçbir şekilde adres çubuğu biçiminde yansıtılmaz.</p> <p> <form method="post" action="../admin/add_story.php"> </p> <p><?php <br>$metin = nl2br($_POST["metnim"]); <br>?> </p> <p><b>Görev:</b> Diyelim ki 2000'den 2050'ye kadar olan yılları içeren bir açılır liste oluşturmak istiyoruz. <br><b>Çözüm:</b> Formu işlemek için SELECT öğeli bir HTML formu ve bir PHP betiği oluşturmak gerekir.</p><p><b>Tartışma:</b></p> <p>İki dosya oluşturarak başlayalım: <b>form.html</b> Ve <b>eylem.php</b>. Dosyada <b>form.html</b> açılır listeli bir html formu içerecektir. Ayrıca listedeki değerler iki şekilde belirtilebilir:</p> <h2>I. Manuel veri girişi:</h2> <p> <select class="input" type=text name=years> <br><option value="2000">2000</option> <br><option value="2001">2001</option> <br><option value="2002">2002</option> <br>…………………………………………… <br><option value="2050">2050</option> <br></select> </p> <h2>II. Döngü yoluyla veri girme:</h2> <p> <select class="input" type=text name=years> <br><?php <br>$yıl = 2000; <br>için ($i = 0 ; $i<= 50 ; $i ++) <span>// 0'dan 50'ye kadar döngü <br></span>{ <br>$yeni_yıllar = $yıl + $i ; <span>// Yeni bir değer oluştur <br></span> Eko " <option value=". $yeni_yıllar .">". $yeni_yıllar."</option>" ; <span>// Yeni bir satır oluştur <br></span>} <br>?> <br></select> </p> <p>Gördüğünüz gibi döngü içeren ikinci örnek daha kompakttır. Form işleyici komut dosyasını vermeye değeceğini düşünmüyorum çünkü tıpkı bir metin alanı gibi işleniyor, yani. liste değerleri süper küresel bir diziden alınabilir <i>$_POST</i>.</p> <p><b>Tanım:</b></p> <p>Sunucuya dosya göndermek için bir HTML formu oluşturalım.</p> <p> <FORM ENCTYPE="multipart/form-data" ACTION="action.php" METHOD=POST> <br><INPUT NAME="myfile" TYPE="file"> <br><INPUT TYPE="submit" value="Dosyayı Aktar"> <br></FORM> </p> <p>Bu html formunun bir öğesi var <i>Araştır</i> Sunucuya yüklenecek dosyayı seçmek için bir iletişim kutusu açar. Düğmeye basarak <i>"Dosya Aktar"</i>, dosya işleyici komut dosyasına aktarılır.</p> <p>O zaman bir komut dosyası işleyicisi yazmanız gerekir <b>eylem.php</b>. İşleyiciyi yazmadan önce dosyayı hangi dizine kopyalayacağımıza karar vermeniz gerekir:</p> <p><?php <br>if(isset($_FILES [ "dosyam" ])) <span>// Eğer dosya mevcutsa <br></span>{ <br>$katalog = "../resim/" ; // Dizinimiz <br>if (is_dir ($katalog )) <span>// Böyle bir dizin varsa <br></span>{ <br>$dosyam = $_FILES [ "dosyam" ][ "tmp_adı" ]; <span>// Geçici dosya <br></span>$dosyamın_adı = $_FILES [ "dosyam" ][ "isim" ]; // Dosya adı <br>if(! copy ($dosyam , $katalog )) echo <span>"Dosya kopyalanırken hata oluştu"</span>. $dosyam_adı <span>// Dosya kopyalama işlemi başarısız olursa <br></span>} <br>else mkdir("../image/"); <span>// Böyle bir dizin yoksa onu oluşturacağız <br></span>} <br>?> </p> <h2>Yorum</h2> <p>Kullanıcıların sunucunuza herhangi bir dosya yüklemesine güveniyorsanız son derece dikkatli olmanız gerekir. Saldırganlar bir görüntüye veya dosyaya "kötü" kod enjekte edebilir ve bunu sunucuya gönderebilir. Bu gibi durumlarda dosyaların indirilmesini sıkı bir şekilde kontrol etmeniz gerekir.</p> <p><a href="https://periscopes.ru/tr/json-opisanie-javascript---json-i-metody-raboty-s-nim-prostoi-primer-json.html">Bu örnek</a> bir dizin oluşturmayı ve bir dosyayı sunucudaki bu dizine kopyalamayı gösterir.</p> <p>Ayrıca bir öğeyle bir örnek göstermek istiyorum <i>onay kutusu</i>. Bu element diğer elementlerden biraz farklıdır, eğer elementlerden biri değilse <i>onay kutusu</i>'a seçilmezse süper küresel bir değişken olur <i>$_POST</i> boş bir değer döndürecektir:</p> <p> <FORM ACTION="file.php" METHOD=POST> <br><input name="mycolor" type="checkbox" value="mavi">Mavi <br><input name="mycolor" type="checkbox" value="siyah">Siyah <br><input name="mycolor" type="checkbox" value="beyaz">Beyaz <br><input name="Submit" type=submit value="Seçmek"> <br></FORM> </p> <p><?php <br>if (!empty($_POST [ "rengim" ])) echo $_POST [ "rengim" ]; <span>// En az 1 öğe seçilirse <br></span> Eko <span>"Değeri seç"</span>; <br>?> </p> <p>İyi günler, web geliştirme severler ve kendi web sitesini yapmak isteyenler. Bundan önce tüm yayınlarım dilin ana unsurlarına, çeşitli içerik nesnelerinin nasıl oluşturulacağına, bunların biçimlendirilmesine, yapılandırılmasına vb. Önceki konulara hakim olduktan sonra zaten oldukça iyi bir site oluşturabilirsiniz. Ancak bugünün konusu olmadan bu yazı eksik kalır: "HTML'de form oluşturma."</p> <p>Dilin bu bölümü çok önemlidir. Bu nedenle, onu incelemeye özellikle dikkat edin, aksi takdirde oluşturduğunuz web kaynağı üretime sunulmayacaktır. Böylece yazımızı okuduktan sonra formların hangi amaçla kullanılması gerektiğini, hangi etiketlerle oluşturulduğunu bilecek ve aynı zamanda deneyebileceksiniz. <a href="https://periscopes.ru/tr/iz-dividi-sdelat-zaryadnoe-ustroistvo-impulsnyi-istochnik-pitaniya-na-baze.html">somut örnekler</a> pratikte. Başlayalım!</p> <h2>Form nedir ve nasıl çalışır?</h2> <blockquote> <p><b>Biçim</b>- Bu, sunucu ile kullanıcı arasında bilgi verisi alışverişi yapmak için tasarlanmış en önemli nesnelerden biridir.</p> </blockquote> <p>Basitçe söylemek gerekirse, sitede ürün sipariş etme, bir web kaynağına kayıt talep etme ve hesaplarla çalışma veya müşterilere şirket yöneticilerinden geri bildirim sağlama olanağına sahip bir çevrimiçi mağaza oluşturmak istiyorsanız, formlar olmadan yapamazsınız.</p> <blockquote> <p>Form, html dilinin özel bir öğesi kullanılarak ayarlanır <b><form> </b>.</p> </blockquote> <p>Kodlu bir belgenin birden fazla etiket bildirimi içerebileceğini unutmayın <b><form> </b> ancak veri işleme için sunucuya yalnızca bir istek gönderilebilir. Bu nedenle kullanıcı tarafından bunun için ayrılmış alanlara girilen bilgiler, <a href="https://periscopes.ru/tr/kak-v-formule-eksel-postavit-znak-umnozheniya-umnozhaem-v-eksele-pravilno.html">değişik formlar</a> bağımlı olmamalıdır. Ayrıca formların iç içe yerleştirilmesine izin verilmez.</p> <p>Sabırsız olanlar ve kod görünümüne hızlıca göz atmak isteyenler için, düğmeli bir şifre için metin alanı olan bir panel kullanmanın basit bir örneğini ekledim:</p> <table><tr><td class="line_numbers"> 1 2 3 4 5 6 7 8 9 10 11 12 </td><td class="code"> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Örnek</title> </head> <body> <form> <p><input name="pas" type="password"><input type="submit"></p> </form> </body> </html> </td> </tr></table><p><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Örnek</title> </head> <body> <form> <p><input name="pas" type="password"><input type="submit"></p> </form> </body> </html></p> <p>Belki şimdi bununla neyin ve nasıl etkileşime girdiği çok açık değildir. <a href="https://periscopes.ru/tr/kak-mozhno-otkryt-fail-fb2-chem-otkryt-format-fb2-na-kompyutere.html">küçük program</a> ancak makalenin tamamını okuduktan sonra kat kat daha zor uygulamalar oluşturabileceğinizi garanti ederim.</p> <h2>Sunucu tarafına veri gönderme</h2> <p>İletişim kutusunda yazılan (veya seçilen) bilgileri göndermek için standart mekanizmayı kullanmanız gerekir - <b>Gönder düğmesi</b>.</p> <blockquote> <p>Bu yöntemin kodu şöyle görünür: <b><input type="submit"> </b></p> </blockquote> <p>Sunulan satırı çalıştırdığınızda, üzerinde "Gönder" yazan bir düğme görüntülenecektir.</p> <p>Sunucu tarafına veri göndermenin bir diğer yolu ise iletişim kutusunda Enter tuşuna basmaktır.</p> <p>Belirtilen bilgilerin gönderilmesi onaylandıktan sonra hemen sunucuya gönderilmez. İlk olarak tarayıcı tarafından işlenerek "ad = değer" biçimine getirilir.</p> <p>Özellik parametresi addan sorumludur <b>tip</b> etiket <b><input> </b> ve değer için - kullanıcı tarafından girilen veriler. Daha sonra dönüştürülen dize, çoğunlukla öznitelikte ayarlanan işleyiciye iletilir. <b>aksiyon</b> eleman <b><form> </b>.</p> <p>Eylem parametresinin kendisi gerekli değildir ve bazı durumlarda hiç gerekli değildir. Örneğin, bir site sayfası şununla yazılmışsa: <a href="https://periscopes.ru/tr/jquery-formy-registracii-i-avtorizacii-delaem-otlichnuyu-sistemu-registracii-s.html">php kullanmak</a> veya js ise işlem geçerli sayfada gerçekleşir ve bağlantılara gerek kalmaz.</p><p>Sitenin işleyişine ilişkin resmin tamamının daha iyi anlaşılması için, sunucuda verilerle çalışmanın zaten başka diller kullanılarak yapıldığını eklemek isterim. Dolayısıyla sunucu dilleri şunlardır: Python, php, C benzeri diller (C#, C vb.), Java ve diğerleri.</p> <p>Şimdi durup element hakkında daha fazla konuşmak istiyorum <b><input> </b>. eğer açıklarsan <a href="https://periscopes.ru/tr/programma-rezervnogo-kopirovaniya-dannyh-na-kompyutere-rezervnoe.html">sade dil</a>, O <b><input> </b> metin alanları, radyo düğmeleri, çeşitli düğmeler, gizli alanlar, onay kutuları ve diğer nesneleri oluşturmak için gereklidir.</p> <p>Etiketin eşleştirilmesi gerekmez <b><form> </b> ancak işlem yapılması gerekiyorsa <a href="https://periscopes.ru/tr/kak-obnovit-binarnyi-su-fail-na-android-vosstanavlivaem.html">kullanıcı girişleri</a> veya bunları örneğin bir veritabanına girin, o zaman konteyner olmadan yapamazsınız.</p> <p>Bu dil öğesinin temel özellikleri <a href="https://periscopes.ru/tr/yazyk-gipertekstovoi-razmetki-html-yazyki-gipertekstovoi-razmetki-sgml-xml.html">Köprü metni biçimlendirme</a>şunlardır:</p> <ul><li><b>Metin</b>- bir metin alanı oluşturur;</li> <li><b>Göndermek</b>– sunucuya veri göndermek için bir düğme oluşturur;</li> <li><b>Resim</b>- resmin bulunduğu düğmeden sorumludur;</li> <li><b>Sıfırla</b>– formu temizleme butonunu ayarlar;</li> <li><b>Şifre</b>– özellikle şifreler için bir metin alanı ayarlar;</li> <li><b>onay kutusu</b>– bayraklı sahalardan sorumlu;</li> <li><b>Radyo</b>– tek öğe seçeneği olan alanlardan sorumludur;</li> <li><b>düğme</b>- bir düğme oluşturur;</li> <li><b>Gizlenmiş</b>– gizli alanlar için kullanılır;</li> <li><b>dosya</b>– dosyaların gönderilmesinden sorumlu alanı ayarlar.</li> </ul><h2>Bilgi aktarma yöntemleri</h2> <p>Kullanıcı verilerini sunucu tarafına aktarmanın 2 yolu vardır: <b>Elde etmek</b> Ve <b>postalamak</b>. Bu yöntemler aynı eylemi gerçekleştirir ancak birbirlerinden önemli ölçüde farklıdırlar. Bu nedenle bunlardan herhangi birine işaret etmeden önce özelliklerini tanıyalım.</p> <table><tbody><tr><td width="260"> </td> <td width="260">postalamak</td> <td width="260">Elde etmek</td> </tr><tr><td width="260">İletilen belgelerin boyutu</td> <td width="260">Sunucu tarafıyla sınırlıdır.</td> <td width="260">Maksimum - 4 KB.</td> </tr><tr><td width="260">Gönderilen bilgiler nasıl görüntülenir?</td> <td width="260">Yalnızca tarayıcı uzantıları veya diğer özel yazılım ürünleri aracılığıyla görüntülendiğinde kullanılabilir.</td> <td width="260">Herkesin kullanımına anında sunulur.</td> </tr><tr><td width="260">Yer imlerini kullanma</td> <td width="260">İstekler tekrarlanmadığından yer işareti koyma seçeneği yoktur (tüm sayfalar aynı adrese bağlanır).</td> <td width="260">İsteği olan herhangi bir sayfa yer imlerine eklenebilir ve bir süre sonra o sayfaya gidebilirsiniz.</td> </tr><tr><td width="260">Önbelleğe almak</td> <td width="260">Önceki paragrafa göre tüm istekler tek sayfadadır.</td> <td width="260">Her sayfa ayrı ayrı önbelleğe alınabilir.</td> </tr><tr><td width="260">amaç</td> <td width="260">İletim için kullanılır <a href="https://periscopes.ru/tr/zalit-fail-dlya-skachivaniya-dropmefiles-mgnovennyi-obmen-bolshimi-failami-bez.html">büyük dosyalar</a>(kitaplar, resimler, videolar vb.), mesajlar, yorumlar.</td> <td width="260">Bir web kaynağında istenen değerleri aramak veya kısa metin mesajları göndermek için idealdir.</td> </tr></tbody></table><p>İki veri aktarım yönteminden hangisinin tarayıcıyla çalışacağını belirtmek için öğede <b><form> </b> sağlanan parametreyi kullanın <b>yöntem</b>(Örneğin, <b>yöntem = "gönder"</b>).</p> <p><img src='https://i1.wp.com/romanchueshov.ru/wp-content/uploads/2016/07/prostaia-forma.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>İkinci örneği ele alalım. Kişisel verilerinizi (adınız, soyadınız, doğum tarihiniz) girmeniz ve bir şifre bulmanız gereken bir form oluşturalım. Bütün bunlar yöntem kullanılarak sunucuya gönderildikten sonra <b>postalamak</b>.</p> <p><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>POST Yöntemi</title> </head> <body> <p>Kişisel verilerinizi girin!</p> <form action="handler.php" method="post"> <p><input name="name" value = "İsim"> <input name="fam" value = "Soyadı"> <input type="date" name="calendar" value="2016-06-11" max="2016-07-31" min="2016-06-01"> <input type="password" name="pass" value = "Şifre"> </p> <p><input type="submit"></p> </form> </body> </html></p> <p>Örneğin, bir tarih girmek için, her parametrenin (gün, ay ve yıl) numarasına yönelik anahtarların yanı sıra kolaylık sağlamak için takvimin kendisini içeren bir açılır panel vardır.</p> <h2>Kayıt paneli oluşturma</h2> <p>Ana etiketler ve özellikler ele alınmıştır. Bu nedenle, css tarzı işaretlemeyi ve giriş verilerinin doğrulanmasını kullanarak tam teşekküllü bir kayıt formu oluşturmanın zamanı geldi. Tabii ki sunucunun onlarla çalışmasını göremeyeceğiz ancak tasarımı ve önemli detayları sağlayacağız.</p> <table><tr><td class="line_numbers"> 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 </td><td class="code"> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Kayıt</title> <style> </style> </head> <body> <form> <fieldset> <legend>siteye kayıt</legend> <h4> </h4> <p>İsim: <input name="name" autofocus required ></p> <p>Soyadı: <input name="fam" required></p> <p>E-posta: <input type="email" required></p> <p>Şifre: <input type="password" name="pass" required></p> <p>Şifre tekrarlama: <input type="password" name="pass" required></p> <p><input type="submit" value="Kayıt olmak"></p> </fieldset> </form> </body> </html> </td> </tr></table><p><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Kayıt</title> <style> body { background-color:#98FB98; background-attachment: fixed; } form{ background-color:#AEEEEE; Color: #006400; font-size:15px; } h4 { color: red; text-align: center; } p { text-align: center; } input { Color: #006400; font-size:15px; border: 5px ridge #98FB98; background-color:#fff; } </style> </head> <body> <form> <fieldset> <legend>siteye kayıt</legend> <h4>Hizmetimizde daha sonra doğru çalışma için lütfen doğru verileri girin!</h4> <p>İsim: <input name="name" autofocus required ></p> <p>Soyadı: <input name="fam" required></p> <p>E-posta: <input type="email" required></p> <p>Şifre: <input type="password" name="pass" required></p> <p>Şifre tekrarlama: <input type="password" name="pass" required></p> <p><input type="submit" value="Kayıt olmak"></p> </fieldset> </form> </body> </html></p> <p>saklamanı tavsiye ederim <a href="https://periscopes.ru/tr/kak-vosstanovit-standartnye-nastroiki-v-nokia-kak-snyat-zashchitnyi-kod.html">verilen kod</a>.html uzantılı ve utf-8 kodlamalı bir belgedeki programları açın ve ikincisini bir tarayıcı penceresinde açın. Tekrarlı olarak ad, soyad, e-posta ve şifre girme alanlarıyla kayıt için tüm ihtişamıyla karşınıza çıkan panel. Sayfa başladığında imlecin hemen ilk metin kutusuna konumlandırıldığına dikkat edin. Bu teknik, nitelik aracılığıyla elde edilir. <b>otomatik odaklama</b>.</p> <p>Merhaba, blog sitesinin sevgili okuyucuları. Çalışmanın devamında, site için çok çeşitli formlar oluşturabileceğiniz form ve giriş etiketlerini nitelikleriyle birlikte () dikkate alıyoruz.</p> <p>Şu veya bu web kaynağının konusu ve içeriği ne olursa olsun, büyük olasılıkla şu veya bu biçimde formlar içerecektir: metin alanları, açılır menüler, <a href="https://periscopes.ru/tr/kachestvennyi-remont-iphone-5s-zamena-knopok-i-razlichnyh.html">çeşitli düğmeler</a> veya anahtarlar. Bu arada, yayınlardan birinde formları çeşitlendirmeye yardımcı olan unsurlardan bahsetmiştim.</p> <p>Tüm olası biçimlerin pratik amacı nedir? Her şeyden önce, özel olarak oluşturulmuş bir komut dosyası (işleyici) aracılığıyla daha ileri işlemler için kullanıcı girişini sunucuya göndermeleri gerekir.</p> <h2>HTML formları - form ve girdiyle nasıl oluşturuldukları</h2> <p>Başlangıçta söylediğim gibi, az ya da çok gelişmiş herhangi bir web sitesinde bir tür web formunun, hatta birkaçının aynı anda bulunması gerekir. Web kaynağının modern gereksinimlere uygunluğu ışığında bunların ne kadar önemli olduğunu anlamak için, size forma dayalı formların ve giriş etiketlerinin kullanıldığı, tek bir adla şüpheye yer bırakmayacak üçlü nesneyi önceden vermek yeterlidir. şu ya da bu yönde bir projeye ihtiyaçları hakkında:</p> <p>Örneğin, geri bildirim oluşturmayla ilgili bir makaleye giden bağlantıyı takip ederseniz (tüm kullanıcıların site yönetimine mesaj göndermesine izin verir), o zaman yalnızca açıklığı olan bir forma sahip bir HTML kodu vardır ( <form>) ve kapanış (</form>) Parça:</p> <p><br><img src='https://i2.wp.com/goldbusinessnet.com/wp-content/uploads/2018/10/2018-10-16_220437.png' align="center" width="100%" loading=lazy loading=lazy></p> <p>İşte form oyunları <a href="https://periscopes.ru/tr/korporativnye-internet-resursy-korporativnye-resursy.html">Önemli rol</a>, çünkü web formunun kurulumunu başlatır. Tek başına web sayfasında bir alan görüntülemez, ancak diğer etiketleri içeren bir kap görevi görür.</p> <p>Bizim durumumuzda (yukarıdaki ekran görüntüsüne bakın), bunlar birkaçını içerir <b>giriş</b>(bu HTML etiketi tek bir etikettir, yani kapatma bileşeni yoktur) ve ayrıca <b>metin alanı</b>, farklı nitelik kümeleriyle. Her biri formda yer alan elemanını tanımlar.</p> <p>16. <b>otomatik odaklama</b>(parametre yok), web sayfası yüklenir yüklenmez odağı alana ayarlayan bir Boole özelliğidir, böylece veriler üzerine tıklamadan girilebilir. Yalnızca = "gizli" giriş türüne uygulanamaz.</p> <p>17. <b>Engelli</b>(değer yok) - kullanıcı için eklendiği form öğesini devre dışı bırakır. Çoğu zaman, erişilemeyen bir öğenin etkinleştirileceği koşulların belirtildiği komut dosyalarıyla birlikte kullanılır.</p> <p>18. <b>Biçim</b>- konteynerin dışında bulunduğunda elemanı forma bağlar <form></form>. Forma bağlantı vermek için etiket eklendi <a href="https://periscopes.ru/tr/vvedenie-v-formy-html5-i-novye-atributy-kak-ispolzovat-data-atributy.html">genel özellik</a> id ve giriş etiketi, değerleri aynı olan form niteliğine sahiptir (örneğin, id = "data" ve form = "data").</p> <p>19. <b>çoklu</b>(parametre yok) - ayarlar <i>çoktan seçmeli seçenek</i> kullanıcı için ve yalnızca type = "dosya" ve type = "e-posta" ile birlikte kullanılır.</p> <p>Alanın dosya yükleme için kullanılması durumunda, bilgisayardan birkaç dosyayı aynı anda seçmek mümkündür. <a href="https://periscopes.ru/tr/pochemu-ne-rabotayut-sochetaniya-klavish-s-ctrl-dlya-chego-nuzhna-knopka-fn-ili.html">Ctrl tuşları</a> veya kaydırma. Adres girme alanı görüntüleniyorsa <a href="https://periscopes.ru/tr/kak-pravilno-rabotat-s-elektronnoi-pochtoi-rabota-s-elektronnoi.html">E-posta</a>(type="email"), ardından e-postaları virgülle ayırarak girin.</p> <p>20. <b>Gerekli</b>(değer yok) - kullanıcı tarafından zorunlu veri girişini etkinleştirir. Bu nedenle, gerekli alan boş bırakılırsa tarayıcı web formunun gönderilmesini engeller ve bu alanın doldurulması gerektiğine dair uygun bir mesaj görüntüler.</p> <p>Bu özellik, grafiksel ve standart düğmeler (type='button | image'') ve gizli giriş alanı (type='hidden') için kullanılmaz.</p> <p>21. <b>boyut</b>— metin alanının genişliğini karakter cinsinden tanımlar (yalnızca "e-posta | şifre | arama | tel | metin | url" parametrelerine sahip tür öğeleri için uygundur). <i>Varsayılan değer 20 karakter</i>.</p> <p>Giriş etiketinin sonraki dört özelliği (22-25), for ile hemen hemen aynı işlevselliğe sahiptir, ancak bütünlüğün sağlanması açısından bunlardan kısaca bahsedeceğim.</p> <p>22. <b>Maksimum uzunluk</b>- bir metin alanını doldururken girilebilecek maksimum karakter sayısına bir sınır getirir. Bu limitin aşılmaya çalışılması durumunda daha fazla giriş engellenecektir. Bu özellik yalnızca type = "e-posta | şifre | arama | tel | metin | url" içeren metin öğeleri için geçerlidir.</p> <p>23. <b>minimum uzunluk</b>- metin alanına girilmesi gereken minimum karakter sayısına bir sınır getirir. Daha az karakter içeren veri gönderilmeye çalışılırsa, form içeriğinin doldurulması gerektiğini belirten kısa bir mesaj görüntülenecek ve halihazırda girilen karakter sayısı hakkında bilgi verilecektir. Kullanım koşulları maksimum uzunluk durumundakiyle tamamen aynıdır.</p> <p>24. <b>Yer tutucu</b>- doğrudan metin alanına bir ipucu (parametre görevi görecektir) koyabilirsiniz; bu, kullanıcı karakterleri girmeye başladığı anda kaybolacaktır. Yalnızca parametreler aracılığıyla oluşturulan alanlar için <i>e-posta, şifre, arama, metin, tel, url</i> giriş etiketinin type özelliği.</p> <p>25. <b>Sadece oku</b>(parametre yok) - Daha önce alana girilen metnin salt okunur ve salt kopyalanabilir olduğunu belirtir. Genellikle bu form öğesini etkinleştirebilecek koşulları belirten komut dosyalarıyla birlikte kullanılır.</p> <p>Ve son olarak, çeşitli form öğelerinin işlevselliğini tamamlayan birkaç özellik daha:</p> <p>26. <b>model</b>- anlamının rolünde yansıtır <a href="https://periscopes.ru/tr/prakticheskoe-vvedenie-v-regulyarnye-vyrazheniya-dlya-novichkov.html">Düzenli ifade</a>, bilgi girme kuralları buna göre belirlenir. Aynı zamanda, parametresi kullanıcıların alanları doldurmasına yardımcı olacak açıklayıcı metin eklemek olan genel bir başlık özelliğinin ek olarak eklenmesi önerilir. Desen yalnızca e-posta, şifre, arama, metin, tel, url öğeleri için geçerlidir. Bir örneğe bakalım. Basitleştirilmiş kayıt formunun kodu ( ile):</p> <table><tbody><tr><td width="65%"> <form> <p>Giriş yapmak <input type="text" name="login" pattern="{5,}" title="Giriş, büyük ve küçük Latin harfleri dahil en az 5 karakter içermelidir."></p> <p>Şifre <input type="password" name="pswd" pattern="{8,}" title="Şifre, büyük ve küçük Latin harflerinin yanı sıra rakamlar da dahil olmak üzere en az 8 karakter içermelidir."></p> <p><input type="submit" value="Kayıt"></p> </form> </td> <td width="35%"> <p>Giriş yapmak <input type="text" name="login" pattern="{5,}" title="Giriş, büyük ve küçük Latin harfleri dahil en az 5 karakter içermelidir."></p> <p>Şifre <input type="password" name="pswd" pattern="{8,}" title="Şifre, büyük ve küçük Latin harflerinin yanı sıra rakamlar da dahil olmak üzere en az 8 karakter içermelidir."></p> <p><input type="submit" value="Kayıt"></p> </td> </tr></tbody></table><p>Oturum açma alanı için (type="text"), Latin karakterlerinin kullanımını ima eden kalıp değeri olarak normal ifade (5,) belirtilir ve en az beş karakter girilmelidir.</p> <p>Metin alanı için, şifre (type = "şifre") (8,) olarak ayarlanır; bu, her durumda yalnızca Latince'nin (büyük ve küçük harfler) ve sayıların girişini belirler; tüm harflerin toplam sayısı ise karakterler sekizden az olmamalıdır.</p> <p>Belirtilen giriş koşulları ihlal edilirse tarayıcı veri gönderilmesine izin vermeyecek ve ilgili bir uyarı görüntüleyecektir:</p> <p><br><img src='https://i0.wp.com/goldbusinessnet.com/wp-content/uploads/2018/10/2018-10-31_225106.png' align="center" width="100%" loading=lazy loading=lazy></p> <p>27. <b>kaynak</b>— "görüntü" grafik düğmesinin görüntülenmesi için görüntünün yolunu (URL, değeridir) tanımlar (yukarıdaki giriş türü parametre tablosuna bakın).</p> <p>28. <b>adım</b>- sayısal değer seçimi sağlayan öğeler için adımı ayarlar (giriş türü = "tarih | tarih-saat-yerel | ay | sayı | aralık | tel | saat | hafta.").</p> <p>Herhangi bir tamsayı veya kesirli sayıyı parametre olarak alabilir. <i>Varsayılan adım = "1"</i>. Son giriş aralığını ayarlamak için yukarıda belirtilen min ve max niteliklerini tekrar kullanabilirsiniz. Açıklık sağlamak için test formuna 2 type="number" öğesi ekleyelim. İlk ayarlanan adım için = "2", ikinci adım için = "0,1":</p> <table><tbody><tr><td class="tab" width="65%"> <form action="formdata"> <p><input type="number" min="-10" max="10" step="2"> <p>0'dan 1'e kadar bir değer girin:</p> <p><input type="number" min="0" max="1" step="0.1"> </form> </td> <td class="tab" width="35%"> <p>-10 ile 10 arasında bir değer girin:</p> <p><input type="number" min="-10" max="10" step="2"></p> <p>0'dan 1'e kadar bir değer girin:</p> <p><input type="number" min="0" max="1" step="0.1"></p> </td> </tr></tbody></table><p>29. <b>değer</b>- işleyiciye aktarılacak form öğesinin değerini ayarlar. İsmin belirlendiği sunucuya bir "isim-parametre" çifti gönderilir <a href="https://periscopes.ru/tr/target-blank--naibolee-nedoocenennaya-uyazvimost-sovremennosti-osnovy-html.html">ad özelliği</a> giriş etiketi ve parametre değer özelliğidir. Aynı zamanda formun çeşitli unsurları için <i>değer farklı roller oynayacak</i>:</p> <ul><li>for type="button | reset | submit" - düğmelerdeki metin etiketini ayarlar;</li> <li>for type = "onay kutusu | radyo | resim" - sunucuya veri gönderilirken ve işlenirken her onay kutusunu, radyo düğmesini veya grafik düğmesini tanımlar;</li> <li>for type = "password | text" - formu yükledikten hemen sonra, alanda kullanıcı tarafından değiştirilebilen veya tamamen silinebilen ön metni görüntüler;</li> <li>for type="file" (dosya yükleme) bu öğeyi etkilemediğinden geçerli değildir.</li> </ul><p>Yukarıdaki seçeneklerin her biri için örnek bir kullanım:</p> <table><tbody><tr><td class="tab" width="65%"> <form action="formdata"> <p><input type="text" name="your_name" value="Adınız"></p> <p>CMS'yi seçin: <input type="radio" name="answer" value="1">WP <input type="radio" name="answer" value="2">Joomla</p> <p><input type="submit" value="Göndermek"></p> </form> </td> <td class="tab" width="35%"> <p><input type="text" name="your_name" value="Adınız"></p> <p>CMS'yi seçin: <input type="radio" name="answer" value="1">WP <input type="radio" name="answer" value="2">Joomla</p> <p><input type="submit" value="Göndermek"></p> </td> </tr></tbody></table><p>Burada <b>değer özellik değeri</b>öğelerin her birinin aşağıdaki bileşenlerini tanımlar: type = "metin" ("Adınız") alanı için bir metin parçası çıktısı verir, type = "radyo" ile ayarlanan radyo düğmelerinin ("1" ve "2") her birini tanımlar "ve ayrıca düğmedeki etiketi etkinleştirir ("Gönder").</p> <h2>Güzel bir HTML formu oluşturma örneği</h2> <p>Daha sonra size, kodu yalnızca giriş türü kombinasyonlarını içermeyen örnek bir web formu sunmaya çalışacağım. <a href="https://periscopes.ru/tr/bezhevyi-rgb-cvet-v-stilyah-mozhno-zadavat-raznymi-sposobami-po.html">farklı değerler</a> standart metin alanları ve düğmeler oluşturan, aynı zamanda örneğin yalnızca doğrudan fare tıklamasıyla değil, aynı zamanda metne tıklayarak da bir öğeye odaklanmayı başlatmanıza olanak tanıyan.</p><p> <div class="back"> <form action="formdata"> <div class="form-1"> <label for="name-1">İsim</label> <input type="text" id="name-1" required> <label for="name-2">Soyadı</label> <input type="text" id="name-2" required> <label for="name-3">Adres</label> <input type="text" id="name-3" required> </div> <div class="form-2"> <div class="in"><input type="tel" id="name-4" placeholder="Telefon numarasını girin"></div> </div> <div class="form-3"> <div class="in"><input type="email" id="name-5" placeholder="E-posta girin"></div> </div> <div class="form-4"> <input type="submit" value="Veri gönder"> </div> </form> </div> </p><p>Benzersiz bir görünüm elde etmek için, ayrı ayrı form bileşenlerinin, her biri aşağıdaki kümelerle birlikte yerleştirildiğini unutmayın:</p><p>Geri (maks. genişlik:350 piksel; kenar boşluğu: 50 piksel otomatik 0; dolgu: 20 piksel; arka plan:#f3ebe1; yazı tipi ailesi:"Oswald", sans-serif;) .form-1, .form-2, .form-3 , .form-4 (padding:15px; border:4px double #909090) .form-1, .form-2, .form-3 (border-bottom:none) .form-1 girişi (ekran:blok; kenar boşluğu- alt:10px;genişlik:%100 .in (dolgu-sol:40px) .in giriş (genişlik:%100) ..png) tekrarlama yok;arka plan konumu:10px 10px) ..png) tekrarlama yok; arka plan konumu: 10 piksel 10 piksel) .form-4 girişi (ekran: blok; yükseklik: 50 piksel; yazı tipi boyutu: 24 piksel; genişlik: %100; imleç: işaretçi)</p><p>Sonuç olarak, böyle bir web formu aşağıdaki şekli alır:</p> <p><img src='https://i0.wp.com/goldbusinessnet.com/wp-content/uploads/2018/11/2018-11-03_202717.png' align="center" height="427" width="398" loading=lazy loading=lazy></p> <p>Daha <a href="https://periscopes.ru/tr/how-to-enter-the-personal-cabinet-of-a-halyk-bank-halyk-bank-and-full-information-of-work.html">full bilgi</a> bu özel formu oluşturmak için <b>bu sayfa</b>(bu arada, burada yalnızca tek tek metin alanlarının işlevselliğini bunlara veri girerek kontrol etmekle kalmaz, aynı zamanda HTML kodunu düzenleyerek ve/veya <a href="https://periscopes.ru/tr/sozdanie-ramok-v-css-svoistvo-border-parametry-ramki-css-parametry.html">css özellikleri</a> görünümünü tamamen veya kısmen değiştirerek).</p> <p>Amacım, sitede çeşitli HTML formları oluşturmak için type özelliğinin ve form etiketinin farklı değerlerini kullanmaya yönelik algoritmayı size tanıtmaktı. Umarım görev tamamlanmıştır. Her durumda, bu farklı konu hakkındaki düşüncelerinizi yorumlarda paylaşın.</p> <p>Doğal olarak sonraki yayınlarda ana hiper metin işaretleme etiketlerinin açıklamasına devam edeceğim, bu nedenle blog güncellemelerine e-posta yoluyla abone olmayı unutmayın. Ayrıca Evgeny Popov'un iletişim formu oluşturmayla ilgili başka bir dersini pekiştirmeye çalışın.</p> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy loading=lazy>");</script> </article> <div class="tags"></div> <script type="text/javascript" src="//yandex.st/share/share.js" charset="utf-8"></script> <div class="yashare-auto-init" data-yashareL10n="ru" data-yashareQuickServices="vkontakte,facebook,twitter,odnoklassniki,moimir,gplus" data-yashareTheme="counter" ></div> <div id="venus-269"></div> </div> <div class="seealso"> <span class="title">Devamını oku:</span> <ul> <li> <div> <a href='https://periscopes.ru/tr/skachat-mody-na-umnyh-zhitelei-dlya-mainkraft-na-android-helpful.html' title='Yararlı Köylüler (akıllı köylüler) Mod akıllı köylüler minecraft 1'i indirin'> <noindex><img width="640" height="426" src="/uploads/216c04e5b2758cba597ccd76165c8c77.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="Yararlı Köylüler (akıllı köylüler) Mod akıllı köylüler minecraft 1'i indirin" sizes="(max-width: 640px) 100vw, 640px" / loading=lazy loading=lazy></noindex> </a> </div> <span class='date'><noindex>2023-08-28 00:15:06</noindex></span> <div><a href='https://periscopes.ru/tr/skachat-mody-na-umnyh-zhitelei-dlya-mainkraft-na-android-helpful.html' title='Yararlı Köylüler (akıllı köylüler) Mod akıllı köylüler minecraft 1'i indirin'>Yararlı Köylüler (akıllı köylüler) Mod akıllı köylüler minecraft 1'i indirin</a></div> </li> <li> <div> <a href='https://periscopes.ru/tr/osnovnyi-komandy-serverov-komandy-v-mainkrafte-dlya-igrokov.html' title='Oyuncular için Minecraft'taki takımlar'> <noindex><img width="640" height="426" src="/uploads/dea5841d88a7243576efd906c2b7c3ac.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="Oyuncular için Minecraft'taki takımlar" sizes="(max-width: 640px) 100vw, 640px" / loading=lazy loading=lazy></noindex> </a> </div> <span class='date'><noindex>2023-08-28 00:15:06</noindex></span> <div><a href='https://periscopes.ru/tr/osnovnyi-komandy-serverov-komandy-v-mainkrafte-dlya-igrokov.html' title='Oyuncular için Minecraft'taki takımlar'>Oyuncular için Minecraft'taki takımlar</a></div> </li> <li> <div> <a href='https://periscopes.ru/tr/programmy-dlya-10-vindy-kompyutere-luchshie-besplatnye-programmy-na-kazhdyi-den.html' title='Her gün için en iyi ücretsiz programlar'> <noindex><img width="640" height="426" src="/uploads/e4cf62cc74751bef0c5fde57552f551d.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="Her gün için en iyi ücretsiz programlar" sizes="(max-width: 640px) 100vw, 640px" / loading=lazy loading=lazy></noindex> </a> </div> <span class='date'><noindex>2023-08-26 00:15:16</noindex></span> <div><a href='https://periscopes.ru/tr/programmy-dlya-10-vindy-kompyutere-luchshie-besplatnye-programmy-na-kazhdyi-den.html' title='Her gün için en iyi ücretsiz programlar'>Her gün için en iyi ücretsiz programlar</a></div> </li> <li> <div> <a href='https://periscopes.ru/tr/hamachi-licenziya-uchimsya-polzovatsya-programmoi-hamachi-chto-eto.html' title='Hamachi programını kullanmayı öğrenmek'> <noindex><img width="640" height="426" src="/uploads/ef76261bc04690d9961a326c9abbe5d9.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="Hamachi programını kullanmayı öğrenmek" sizes="(max-width: 640px) 100vw, 640px" / loading=lazy loading=lazy></noindex> </a> </div> <span class='date'><noindex>2023-08-26 00:15:16</noindex></span> <div><a href='https://periscopes.ru/tr/hamachi-licenziya-uchimsya-polzovatsya-programmoi-hamachi-chto-eto.html' title='Hamachi programını kullanmayı öğrenmek'>Hamachi programını kullanmayı öğrenmek</a></div> </li> <li> <div> <a href='https://periscopes.ru/tr/skachat-programmu-easyrecovery-professional-na-russkom-yazyke-ontrack-easy-recovery-pro.html' title='Ontrack Easy Recovery Pro silinen dosyaları kurtarabilir'> <noindex><img width="640" height="426" src="/uploads/30884260e226016a17e374b2b3576315.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="Ontrack Easy Recovery Pro silinen dosyaları kurtarabilir" sizes="(max-width: 640px) 100vw, 640px" / loading=lazy loading=lazy></noindex> </a> </div> <span class='date'><noindex>2023-08-26 00:15:16</noindex></span> <div><a href='https://periscopes.ru/tr/skachat-programmu-easyrecovery-professional-na-russkom-yazyke-ontrack-easy-recovery-pro.html' title='Ontrack Easy Recovery Pro silinen dosyaları kurtarabilir'>Ontrack Easy Recovery Pro silinen dosyaları kurtarabilir</a></div> </li> <li> <div> <a href='https://periscopes.ru/tr/servisnyi-centr-nokia-remont-sotovyh-telefonov-nokia-gde-pochinit-telefon.html' title='Nokia cep telefonlarının onarımı Nokia telefonu nerede tamir edilir'> <noindex><img width="640" height="426" src="/uploads/0c2dfafd390fce3fd99f7863cbbc4bf5.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="Nokia cep telefonlarının onarımı Nokia telefonu nerede tamir edilir" sizes="(max-width: 640px) 100vw, 640px" / loading=lazy loading=lazy></noindex> </a> </div> <span class='date'><noindex>2023-08-25 00:15:17</noindex></span> <div><a href='https://periscopes.ru/tr/servisnyi-centr-nokia-remont-sotovyh-telefonov-nokia-gde-pochinit-telefon.html' title='Nokia cep telefonlarının onarımı Nokia telefonu nerede tamir edilir'>Nokia cep telefonlarının onarımı Nokia telefonu nerede tamir edilir</a></div> </li> </ul> </div> </div> </div> </div> <footer> <nav id="links"> </nav> <div id="footer"> <div class="icon-logos_footer" style="position:absolute; top:16px; left:18px; width: 119px; height: 19px;"> </div> <span>© 2023. Mobil teknolojiler ve telekom operatörleri</span> <div> </div> </footer> </div> </div> </div> <script type='text/javascript' src='https://periscopes.ru/wp-content/plugins/wp-polls/polls-js.js?ver=2.73.7'></script> <script type='text/javascript' src='/wp-includes/js/comment-reply.min.js?ver=4.8.2'></script> <script type='text/javascript'> var q2w3_sidebar_options = new Array(); q2w3_sidebar_options[0] = { "sidebar" : "sidebar-article", "margin_top" : 10, "margin_bottom" : 0, "stop_id" : "", "screen_max_width" : 0, "screen_max_height" : 0, "width_inherit" : false, "refresh_interval" : 1500, "window_load_hook" : false, "disable_mo_api" : false, "widgets" : ['text-20'] } ; </script> <script type='text/javascript' src='https://periscopes.ru/wp-content/plugins/q2w3-fixed-widget/js/q2w3-fixed-widget.min.js?ver=5.0.4'></script> <script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=4.8.2'></script> <script type='text/javascript' src='https://periscopes.ru/wp-content/plugins/akismet/_inc/form.js?ver=4.0'></script> <script type="text/javascript"> $(document).ready(function(){ var bg = $(".slider > ul > li > a > img").attr ("src"); $(".slider").css("background", "url("+bg+")"); $(".slider > ul > li:first-child").addClass ("active"); } ); $(function () { $("#devider").masonry({ itemSelector: ".vpost" } ); $(".sub-menu").each(function () { $(this).parent().eq(0).hover(function () { $(this).addClass("li-hover"); } , function () { $(this).removeClass("li-hover"); } ); } ); $(".tabs-all-cat > li").each(function () { $(this).hover(function () { $(this).addClass("li-hover"); $(".tabs-all-cat > li > ul").show(); } , function () { $(this).removeClass("li-hover"); $(".tabs-all-cat > li > ul").hide(); } ); } ); $(".slider-a").click(function () { $(".slider > ul > li").removeClass ("active"); $(this).parent().addClass ("active"); var bg = $(".active > a > img").attr ("src"); $(".slider").css("background", "url("+bg+")"); } ); } ); </script> </body> </html>