Form html kümesi. HTML formları. Çok satırlı metin alanı - etiket

Merhaba, blog sitesinin sevgili okuyucuları. Çalışmamıza devam ederek, site için çok çeşitli formlar oluşturabileceğiniz form ve giriş etiketlerini nitelikleriyle () ele almaya devam ediyoruz.

Belirli bir web kaynağının konusu ve içeriği ne olursa olsun, büyük olasılıkla şu veya bu şekilde formlar içerecektir: metin alanları, açılır menüler, çeşitli düğmeler veya anahtarlar. Bu arada, yayınlardan birinde formları çeşitlendirmeye yardımcı olan unsurlardan bahsetmiştim.

Tüm olası biçimlerin pratik amacı nedir? Her şeyden önce, özel olarak oluşturulmuş bir komut dosyası (işleyici) kullanarak daha fazla işlem yapmak amacıyla kullanıcı tarafından girilen verileri sunucuya göndermeleri gerekir.

HTML formları - form ve girdi kullanılarak nasıl oluşturuldukları

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. Bir web kaynağının modern gereksinimlere uygunluğu ışığında bunların ne kadar önemli olduğunu anlamak için, form ve giriş etiketlerine dayalı formları kullanan, yalnızca adlarıyla bile özellikleri hakkında hiçbir şüphe bırakmayan üç nesneyi size hazırlıksız olarak vermek yeterlidir. şu ya da bu yönde bir projenin gerekliliği:

Ö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 açıklığı olan bir form içeren HTML kodu (

) ve kapanış (

) Parça:

Burası, web formunun kurulumunu başlattığı için formun hayati bir rol oynadığı yerdir. Kendisi bir web sayfasında bir alan görüntülemez, ancak diğer etiketleri içeren bir kap görevi görür.

Bizim durumumuzda (yukarıdaki ekran görüntüsüne bakın), bunlar birkaçını içerir giriş(bu HTML etiketi tektir, yani kapatma bileşeni yoktur) ve ayrıca metin alanı, farklı nitelik kümeleriyle. Her biri formda yer alan kendi öğesini tanımlar.

16. Otomatik odaklama(parametre yok), web sayfası yüklendiğinde odağı hemen alana ayarlayan ve bunun sonucunda üzerine tıklamadan veri girebileceğiniz mantıksal bir özelliktir. Yalnızca = "gizli" giriş türüne uygulanamaz.

17. Engelli(değerler olmadan) - 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.

18. Biçim— öğeyi kabın dışında bulunduğunda formla ilişkilendirir

. Bağlamak için form etiketine global bir kimlik özelliği eklenir ve giriş etiketine değerleri aynı olan bir form özelliği eklenir (örneğin, id = "data" ve form = "data") .

19. Çoklu(parametre yok) - ayarlar çoktan seçmeli seçenek kullanıcı için ve yalnızca type = "dosya" ve type = "e-posta" ile birlikte kullanılır.

Dosya yükleme alanını kullanıyorsanız Ctrl veya Shift tuşlarını kullanarak bilgisayarınızdan birden fazla dosyayı aynı anda seçebilirsiniz. E-posta adresinin girilmesine yönelik bir alan görüntülenirse (type="email"), e-postalar virgülle ayrılmış olarak girilmelidir.

20. Gerekli(değer yok) – kullanıcının veri girme gereksinimini etkinleştirir. Bu nedenle, gerekli bir alan boş bırakılırsa tarayıcı web formunun gönderilmesini engeller ve bu alanın doldurulması gerektiğine ilişkin ilgili bir mesaj görüntüler.

Bu özellik, grafik ve standart düğmeler (type='button | image'') ve gizli giriş alanları (type='hidden') için kullanılmaz.

21. Boyut— metin alanının karakter cinsinden genişliğini belirler (yalnızca "e-posta | şifre | arama | tel | metin | url" parametrelerine sahip tür öğeleri için uygundur). Varsayılan değer 20 karakterdir.

Giriş etiketinin sonraki dört özelliği (22-25), for ile hemen hemen aynı işlevselliği taşır, ancak bütünlüğün sağlanması adına bunlardan da kısaca bahsedeceğim.

22. Maksimum uzunluk— bir metin alanını doldururken girilebilecek maksimum karakter sayısına bir sınır getirir. Bu sınırı aşmaya çalışırsanız daha fazla giriş engellenecektir. Bu özellik yalnızca type="email | şifre | arama | tel | metin | url" içeren metin öğeleri için geçerlidir.

23. Minimum uzunluk— 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, formun içeriğinin tamamlanması gerektiğini belirten kısa bir mesaj görünecek ve halihazırda girilen karakter sayısı hakkında bilgi sağlanacaktır. Kullanım koşulları maksimum uzunluk durumundakiyle tamamen aynıdır.

24. Yer tutucu- doğrudan metin alanına bir ipucu yerleştirebilirsiniz (parametre görevi görecektir), kullanıcı karakterleri girmeye başladığı anda kaybolacaktır. Yalnızca parametreler kullanılarak oluşturulan alanlar için e-posta, şifre, arama, metin, tel, url giriş etiketinin type niteliği.

25. Sadece oku(parametre yok) - alana daha önce girilen metnin yalnızca okuma ve kopyalama için uygun olduğunu belirtir. Genellikle, karşılandığında bu form öğesini etkinleştirebilecek koşulların belirtildiği komut dosyalarıyla birlikte kullanılır.

Ve son olarak, çeşitli form öğelerinin işlevselliğini tamamlayan birkaç özellik daha:

26. Model- değeri olarak, bilgi girme kurallarının belirlendiği düzenli bir ifadeyi yansıtır. Bu durumda, kullanıcıların alanları doldurmasına yardımcı olmak için açıklayıcı metin ekleyebileceğiniz bir parametre olarak ek olarak genel bir başlık özelliği eklemeniz önerilir. Desen yalnızca e-posta, şifre, arama, metin, tel, url öğelerine uygulanır. Bir örnekle anlayalım. Basitleştirilmiş bir kayıt formunun kodu ( ile):

Giriş yapmak Şifre

Giriş yapmak Şifre

Oturum açma alanı için (type="text"), kalıp değeri olarak Latin karakterlerinin kullanımını ima eden bir normal ifade (5,) belirtilir ve en az beş karakter girilmelidir.

Parolanın metin alanıyla ilgili olarak (type = "password"), değer (8,) olarak ayarlanır; bu, her durumda yalnızca Latin karakterlerinin (büyük ve küçük harfler) ve sayıların girişini belirtir, tüm karakterlerin toplam sayısı sekizden az olmamalıdır.

Belirtilen giriş koşulları ihlal edilirse tarayıcı veri göndermenize izin vermeyecek ve uygun bir uyarı görüntüleyecektir:

27. Kaynak— "görüntü" grafik düğmesini görüntülemek için görüntünün yolunu (URL, değeridir) tanımlar (yukarıdaki giriş türü parametreleri tablosuna bakın).

28. Adım— 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.").

Herhangi bir tamsayı veya kesirli sayıyı parametre olarak alabilir. Varsayılan adım = "1". 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 öğe type='number' dahil edeceğiz. İlki için adım = "2" ve ikincisi için adım = "0,1" olarak ayarlayın:

0 ile 1 arasında bir değer girin:

-10 ile 10 arasında bir değer girin: 0 ile 1 arasında bir değer girin:

29. Değer— işleyiciye aktarılacak form öğesinin değerini ayarlar. Sunucuya bir ad-parametre çifti gönderilir; burada ad, giriş etiketinin ad niteliğine göre belirlenir ve parametre, değer niteliğine göre belirlenir. Ayrıca çeşitli form elemanları için değer farklı roller oynayacak:

• for type="button | reset | submit" - düğmelerdeki metin etiketini ayarlar;
• for type = "onay kutusu | radyo | resim" - sunucuya veri gönderilirken ve işlenirken her onay kutusunu, anahtarı veya grafik düğmesini tanımlar;
• type = "password | text" için - formu yüklerken hemen alanda kullanıcı tarafından değiştirilebilen veya tamamen silinebilen ön metni görüntüler;
• for type="file" (dosya yükleme) bu öğeyi etkilemediğinden geçerli değildir.

Yukarıdaki seçeneklerin her biri için örnek kullanım:

CMS'yi seçin: W.P. Joomla

CMS'yi seçin: W.P. Joomla

Burada değer özellik değeri her öğenin aşağıdaki bileşenlerini tanımlar: type = "text" ("Adınız") alanı için bir metin parçası görüntüler, type = "radyo" kullanılarak ayarlanan radyo düğmelerinin ("1" ve "2") her birini tanımlar, ve ayrıca düğmedeki yazıyı etkinleştirir ("Gönder").

Güzel bir HTML formu oluşturma örneği

Daha sonra size, kodu yalnızca standart metin alanları ve düğmeler oluşturan farklı değerlere sahip giriş türü kombinasyonlarını değil, aynı zamanda örneğin odaklanmayı başlatmanıza olanak tanıyan örnek bir web formu sunmaya çalışacağım. Bir öğeyi yalnızca doğrudan fare tıklamasıyla değil, aynı zamanda metne tıklayarak da seçebilirsiniz.

Benzersiz bir tasarım elde etmek için, her biri aşağıdaki setlere sahip ayrı form bileşenlerinin yerleştirildiğini lütfen unutmayın:

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 (padding-left: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)

Sonuç olarak, böyle bir web formu aşağıdaki taslağı alır:

Bu özel formun oluşturulmasına ilişkin daha kapsamlı bilgiyi şu adreste bulabilirsiniz: bu sayfa(bu arada, burada yalnızca tek tek metin alanlarının işlevselliğini bunlara veri girerek test etmekle kalmaz, aynı zamanda HTML kodunu ve/veya CSS özelliklerini düzenleyerek, görünümünü tamamen veya kısmen değiştirerek web formuyla denemeler yapabilirsiniz.

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.

Doğal olarak sonraki yayınlarda hiper metin işaretlemesinin ana etiketlerini açıklamaya devam edeceğim, bu nedenle blog güncellemelerine e-posta yoluyla abone olmayı unutmayın. Ayrıca bunu güçlendirmek için Evgeniy Popov'un iletişim formu oluşturmayla ilgili başka bir dersine bakın.

Tanım

HTML etiketi

Kullanıcı girişini sunucuya göndermek için kullanılan bir HTML formu oluşturur.

Formun kendisi kullanıcı girişi için herhangi bir araç sağlamadığından öğenin içinde amacı kullanıcıya farklı veri girme yolları sağlamak olan diğer öğeleri içerir:

Bu öğelere ek olarak form içinde diğer HTML öğelerini de kullanabilirsiniz.

Varsayılan olarak form web sayfasında hiçbir şekilde görüntülenmez, yalnızca içinde bulunan öğeler görünür, ancak CSS kullanarak forma istediğiniz görünümü verebilirsiniz.

Öznitellikler

kabul-karakter kümesi: İşlenmek üzere sunucuya gönderilen form girişi için bir karakter kodlamasını veya boşlukla ayrılmış karakter kümeleri listesini belirtir. Veriler belirtilen kodlama tarafından desteklenmeyen karakterler içeriyorsa tarayıcı bunlar için uygun kodlamayı belirlemeye çalışır. Uygun kodlama belirlenemediği takdirde karakterler sayısal kodlara dönüştürülür.

Varsayılan değer, ayrılmış dize "BİLİNMİYOR"dur (tarayıcılar bu değeri, öğeyi içeren belgeninkiyle aynı karakter kodlaması olarak yorumlar). ). eylem: Doldurulmuş formdaki verilerin gönderileceği ve bu bilgilerin işleneceği adresi belirtir. otomatik tamamlama: Form otomatik tamamlamanın etkinleştirilip etkinleştirilmeyeceğini belirler. Otomatik doldurma etkinleştirildiğinde tarayıcı, kullanıcının formu önceki kullanımında girdiği değerleri otomatik olarak doldurur. Olası özellik değerleri:

• Açık: tarayıcı, kullanıcı tarafından önceden girilen değerleri (varsayılan değer) otomatik olarak görüntüler.
• kapalı: Kullanıcı, formun her kullanımında her alan için değerleri girmelidir. Daha önce girilen değerler gösterilmeyecektir.

Not: Otomatik tamamlama özelliği Opera tarayıcısı tarafından desteklenmez.

Enctype: Form verilerinin sunucuya gönderildiğinde nasıl kodlanacağını belirtir. Yalnızca method="post" özelliğiyle birlikte kullanılabilir. Olası değerler:

• application/x-www-form-urlencoded: varsayılan: tüm karakterler gönderilmeden önce kodlanır (boşluklar "+" karakterlere ve özel karakterler ASCII HEX değerlerine dönüştürülür).
• çok parçalı/form-veri: karakterler kodlanmamıştır. Elementler için kullanılır type niteliği "file" olarak ayarlanan .
• metin/sade: boşluklar "+" karakterine dönüştürülür ancak kesme işareti gibi özel karakterleri onaltılık değerlere kodlamaz.

yöntem: Form verileri gönderilirken kullanılacak HTTP veri aktarım yöntemini belirtir. Olası değerler:

• elde etmek: Veriler, URL'nin sonuna eklenerek ad=değer çiftleri halinde tarayıcının adres çubuğuna iletilir. Ana URL ile iletilen veriler arasında ayırıcı olarak soru işareti (?), iletilen verileri birbirinden ayırmak için ise ve işareti karakteri (&) kullanılır. Bu yöntem küçük veriler gönderilirken kullanılır.
• postalamak: veriler URL'nin bir parçası olarak değil, tarayıcı isteğinin içeriği olarak gönderilir. Bu yöntem büyük miktarda veri göndermek için kullanılır.

Yöntem niteliği belirtilmezse, varsayılan olarak GET yöntemi kullanılacaktır. name: Formun adını belirtir. Ad, JavaScript'te bir öğeye adıyla atıfta bulunmak veya gönderildikten sonra form verilerine başvurmak için kullanılabilir. Bir belgede birden fazla form kullanılıyorsa bunların adları tekrarlanmamalı ve nitelik değeri olarak boş bir dize bırakılmamalıdır. novalidate: Forma girilen verilerin gönderilmeden önce doğrulanmayacağını belirtir. Novalidate boolean özelliği için olası değerler:

Not: Novalidate özelliği IE9 ve önceki sürümlerde ve Safari'de desteklenmez.

Hedef: Form gönderildikten sonra alınan yanıtın nerede görüntüleneceğini belirten bir çerçeve adı veya anahtar kelime tanımlar.

• _boşluk: belgeyi yeni bir pencere veya sekmede açar.
• _kendi: bağlantının bulunduğu dizinde bir belge açar (varsayılan).
• _ebeveyn: belgeyi ana çerçevede açar.
• _tepe: belgeyi pencerenin tam genişliğinde açar.
• çerçeve_adı: adı değer olarak belirtilen bir iframe'de belge açar.

Etiket ayrıca Küresel Nitelikler ve Etkinlikleri de destekler

Varsayılan tarz

form ( görüntü: blok; kenar boşluğu üst: 0em; )

Örnek

İsim:
Soyadı:

Kullanıcı web sitelerinde gezinirken çoğunlukla yalnızca bağlantılar Web sayfalarında gezinmek için.

Ancak kullanıcının bazen kendi bilgilerini sağlaması gerektiği açıktır. giriş alanları. Bu tür etkileşimler şunları içerir:

• web sitelerine kaydolma ve oturum açma;
• kişisel bilgilerin girilmesi (isim, adres, kredi kartı bilgileri vb.);
• içerik filtreleme (açılır listeler, onay kutuları vb. kullanılarak);
• bir arama yapmak;
• dosyaları indiriyorum.

Bu ihtiyaçları karşılamak için HTML etkileşimli olanaklar sunar kontroller formlar:

• metin alanları (bir veya daha fazla satır için);
• anahtarlar;
• onay kutuları;
• açılır listeler;
• indirmek için widget'lar;
• düğmeleri gönderin.

Bu kontroller farklı Etiketler HTML, ancak çoğu etiketi kullanıyor . Kendi kendine kapanan bir öğe olduğundan alanın türü, type niteliğine göre belirlenir:

Öğe

tanımlayan bir blok elemanıdır etkileşimli bir web sayfasının parçası. Sonuç olarak, tüm kontroller (örneğin , veya <button>) olmalıdır <i>içeri</i> eleman <form> .</p><p>İki HTML özelliği <b>gerekli</b>:</p><ul><li>eylem belirleyen bir adres içerir <i>Nerede</i> form bilgileri gönderilecek;</li><li>yöntem GET veya POST olabilir ve <i>Nasıl</i> Form bilgileri gönderilecektir.</li> </ul><p>Genellikle form bilgileri şu adrese gönderilir: <b>sunucu</b>. <i>Nasıl</i> bu veriler daha sonra bu kılavuzun kapsamı dışında işlenecektir.</p><p>Formu, aşağıdaki amaçlara ulaşmak için birlikte çalışan kontrollerin bir koleksiyonu olarak düşünün: <b>bir</b> operasyon. Bir site giriş formu yazdıysanız, <b>üç</b> alanlar:</p><ul><li>e-posta alanı <input type="email"> </li><li>şifre alanı <input type="password"> </li><li>gönder düğmesi <input type="submit"> </li> </ul><p>Bu üç HTML öğesi tek bir formda yer alacaktır <span><form action="/login" method="POST"> </span>.</p><p>Benzer şekilde, aynı HTML sayfasına, ayrı bir öğeye bir kayıt formu ekleyebilirsiniz. <form> .</p><h2>Metin alanları</h2><p>Hemen hemen tüm formlar gerektirir <b>metin</b> Kullanıcılardan adlarını, e-posta adreslerini, şifrelerini, adreslerini vb. girmeleri istenir. Form metin alanları farklı çeşitlerde gelir.</p><p>Bu alanlar çok benzer olmasına ve kullanıcıların her türlü metni (yanlış olanları bile) girmesine izin vermesine rağmen, türleri belirli bir metin sağlar. <b>anlambilim</b> giriş için, alanın hangi bilgiyi belirlediğini belirleme <b>mutlak</b> içermek.</p><p>Tarayıcılar daha sonra kontrolün arayüzünü iyileştirmek için biraz değiştirebilir. <i>etkileşim</i> veya hangi içeriğin beklendiğini önerin.</p><p>Örneğin, şifre alanında semboller yerine noktalar gösteriliyor. Sayı alanı ise yukarı ve aşağı tuşlarını kullanarak değeri artırmanızı/azaltmanızı sağlar.</p><h2>Yer tutucu</h2><p>Metin alanları görüntülenebilir <b>müstehcen</b> bir metin girildiği anda kaybolacak olan metin.</p><p> <input type="text" placeholder="Adınızı giriniz"> </p><p>Bir şey yazmaya başladığınızda “Adınızı girin” yazısının kaybolduğunu göreceksiniz.</p><h2><label></h2><p>Form öğelerinin kendileri çok açıklayıcı olmadığından, genellikle bunların önünde metin bulunur. <b>etiket</b>.</p><p> <label>E-posta</label> <input type="email"> </p><p>Yer tutucu, hangi içeriğin beklendiği konusunda zaten bazı ipuçları sağlasa da, etiketler her zaman görünür kalma avantajına sahiptir ve onay kutuları veya radyo düğmeleri gibi diğer form öğesi türleriyle birlikte kullanılabilir.</p><p>Form öğelerini tanımlamak için kısa paragraflar kullanabilseniz de, <label>anlamsal olarak daha doğrudur çünkü bunlar yalnızca formlarda mevcuttur. <label>alanın kimlik değerine karşılık gelen for niteliği kullanılarak belirli bir form öğesiyle de ilişkilendirilebilir.</p><p> <label for="first_name">İsim</label> <input id="first_name" type="text"> </p><p>Etiketi tıklattığınızda odak metin alanına gider ve imleci metin alanına yerleştirir. Şu ana kadar bu paket işe yaramaz gibi görünüyor, ancak onay kutuları ve anahtarlarla kullanışlı olacaktır.</p><h2>Onay kutuları</h2><p><b>Onay kutuları</b>- Bunlar yalnızca iki duruma sahip olan form öğeleridir: açık veya kapalı. Temel olarak kullanıcının bir şeye "Evet" veya "Hayır" demesine izin verirler.</p><p> <input type="checkbox">Beni Hatırla</p><p>Küçük bir onay kutusuna tıklamak zor olabileceğinden, onay kutusunu ve açıklamasını içine yerleştirmeniz önerilir. <label> .</p><p> <label> <input type="checkbox">Koşullara katılıyorum</label> </p><p>Onay kutusunu işaretlemek için “Şartları kabul ediyorum” metnine tıklayabilirsiniz.</p><p>Varsayılan olarak onay kutusu devre dışıdır. Checked özelliğini kullanarak bunu etkin olarak işaretleyebilirsiniz.</p><p> <label> <input type="checkbox" checked>Fatura adresimi kullan</label> </p><h2>Anahtarlar</h2><p>Kullanıcıya sağlayabilirsiniz <b>seçenekler listesi</b> anahtarlar kullanılarak seçilebilir.</p><p>Bu form öğesinin çalışması için HTML kodunuzun <b>grup</b> radyo düğmelerinin listesi birlikte. Bu, name özelliği için aynı değer kullanılarak elde edilir:</p><p> <label>Aile durumu</label> <label> <input type="radio" name="status">Bekar</label> <label> <input type="radio" name="status">Evli</label> <label> <input type="radio" name="status">Boşanmış</label> <label> <input type="radio" name="status">Dul</label> </p><p>Tüm radyo düğmeleri name niteliği için aynı değeri kullandığından (bu durumda, status değeri), bir seçeneğin seçilmesi diğerlerinin hepsini geçersiz kılacaktır. Anahtarlar <b>birbirini dışlayan</b>.</p><h3>Radyo düğmeleri ve onay kutuları arasındaki fark</h3><p>Onay kutusu mevcut olmasına rağmen <b>Kendi başıma</b>, anahtarlar yalnızca formda görünebilir <b>liste</b>(bu en az iki seçenek anlamına gelir).</p><p>Ayrıca, onay kutusunun tıklatılması <b>keyfi</b> radyo düğmelerinden birini seçerken <b>zorunlu</b>. Bu nedenle en yakın seçeneği seçtiğinizde anahtarı kapatmanız mümkün değildir. Sonunda her zaman anahtarlardan biri seçilir.</p><h2>Açılır Menüler</h2><p>Aralarından seçim yapabileceğiniz seçeneklerin sayısı çok fazla yer kaplıyorsa açılır menüleri kullanabilirsiniz. <select> .</p><p>Anahtarlara benzer şekilde çalışırlar, yalnızca düzen farklıdır.</p><p> <select> <option>Ocak</option> <option>Şubat</option> <option>Mart</option> <option>Nisan</option> <option>Mayıs</option> <option>Haziran</option> <option>Temmuz</option> <option>Ağustos</option> <option>Eylül</option> <option>Ekim</option> <option>Kasım</option> <option>Aralık</option> </select> </p><h3>Açılır menüden çoklu seçim</h3><p>Multiple özelliğini eklerseniz birden fazla seçenek seçme olanağı sağlayabilirsiniz.</p><p> <label>Hangi tarayıcıları kullanıyorsunuz?</label> <select multiple> <option>Google Chrome</option> <option>İnternet Explorer</option> <option>Mozilla Firefox</option> <option>Opera</option> <option>Safari</option> </select> </p><p>Ctrl (veya ⌘) tuşunu basılı tutarak ve tıklayarak birden fazla seçeneği seçin. Bu, satır başına birden fazla onay kutusu kullanmaya iyi bir alternatif olabilir.</p><h2>Örnek: tam kayıt formu</h2> <form action="/signup" method="POST"> <p> <label>Çekici</label> <label> <input type="radio" name="title" value="Bay">Bay.</label> <label> <input type="radio" name="title" value="bayan">Bayan.</label> </p> <p> <label>İsim</label> <input type="text" name="first_name"> </p> <p> <label>Soyadı</label> <input type="text" name="last_name"> </p> <p> <label>E-posta</label> <input type="email" name="email"> </p> <p> <label>Telefon</label> <input type="tel" name="phone"> </p> <p> <label>Şifre</label> <input type="password" name="password"> </p> <p> <label>Şifreyi onaylayın</label> <input type="password" name="password_confirm"> </p> <p> <label>Bir ülke</label> <select name="country"> <option>Kanada</option> <option>Fransa</option> <option>Almanya</option> <option>İtalya</option> <option>Japonya</option> <option>Rusya</option> <option>Büyük Britanya</option> <option>Amerika Birleşik Devletleri</option> </select> </p> <p> <label> <input type="checkbox" name="terms">Kullanım şartlarını kabul ediyorum</label> </p> <p> <button>Kayıt olmak</button> </p> </form> <p>Başka form öğeleri de mevcuttur ancak en çok kullanılanlara baktık.</p> <p><b>Sitedeki HTML formlarını tanımlayan HTML etiketleri</b></p> <p><b>İnternette web siteleri ve bireysel sayfalar oluşturuyoruz</b> ziyaretçilerle iletişim kurmak.</p> <p><b>HTML formları</b> Ziyaretçileri siteye kaydetmek, etkileşimli anketler ve oylama yapmak, mesaj göndermenize, satın alma işlemleri yapmanıza vb. olanak sağlamak için kullanılır. <b>HTML</b> Form tek bir amaç için oluşturulmuştur: bir yazılım komut dosyası veya e-posta yoluyla işlenmek üzere bilgi toplamak ve ardından iletmek.</p> <i> </i><h2>Örnek HTML formu | Siteye girin</h2> <p>Etiketler, nitelikler ve değerler</p> <ul><li><form> </form>- şekli belirleyin.</li> <li>name = "" - formun adını tanımlar.</li> <li>method = "" - formdan veri gönderme yöntemini tanımlar. Değerler: "get" (varsayılan) ve "post". Büyük miktarda verinin aktarılmasına izin verdiği için "post" yöntemi sıklıkla kullanılır.</li> <li>action = "" - verilerin işlenmek üzere gönderildiği URL'yi tanımlar. Bizim durumumuzda - enter_data.php ..</li> <li><input />- veri girişi için düğmeler, anahtarlar, metin alanları gibi form öğelerini tanımlayın.</li> <li>type = "metin" - veri girişi için bir metin alanı tanımlar.</li> <li>type = "password" - metnin yıldız işareti veya daire şeklinde görüntülendiği, şifre girmek için bir alan tanımlar.</li> <li>type = "onay kutusu" - bir radyo düğmesini tanımlar.</li> <li>type = "hidden" - sunucuya ek bilgi aktarmak için kullanılan gizli bir form öğesini tanımlar.</li> <li>size = "25" - metin alanının karakter cinsinden uzunluğu.</li> <li>maxlength = "30" - izin verilen maksimum girilen karakter sayısı.</li> <li>değer = "" - radyo düğmeleri veya anahtarlarla ilgiliyse işlenmek üzere gönderilecek değeri tanımlar. Bu özelliğin bir metin alanı veya düğmenin parçası olarak değeri, yukarıdaki örnekte örneğin Vasya veya Giriş olarak gösterilecektir.</li> </ul><h2>Örnek HTML formu | Sitedeki yorumlar</h2> <table class="jsexam"><tr><td> <span> <title>Örnek HTML formu</title><br> </head><br> <body><br> <form action="http://сайт/comments.php" method="post" name="commentform" id="commentform"><br> <p><input type="text" name="author" id="author" value="" size="25" /><br> <small>İsim</small><br></p><br> <p><input type="text" name="email" id="email" value="" size="25" /><br> <small>Posta</small><br></p><br> <p><textarea name="comment" id="comment" cols="48" rows="8">

Etiketler, nitelikler ve değerler

• action = "http://site/comments.php" - formdaki verilerin gönderileceği URL'yi tanımlar.
• id = "" - form öğesinin adını ve tanımlayıcısını tanımlar.
• name = "" - form öğesinin adını tanımlar.
• - formun bir parçası olarak bir metin alanı tanımlayın.
• cols = "" - form metin alanının sütun sayısını belirler.
• satırlar = "" - form metin alanının satır sayısını tanımlar.

arasında ise metin yerleştirin, kolayca kaldırılabilecek bir örnek olarak alanın içinde gösterilecektir.

Örnek HTML formu | Açılır liste

İlk pozisyon İkinci konum Üçüncü konum Dördüncü konum

Etiketler, nitelikler ve değerler

• - seçilecek konumları içeren bir liste tanımlayın.
• size = "" - görünür liste konumlarının sayısını belirler. Değer 1 ise, bir açılır listeyle karşı karşıyayız.
• - listenin konumlarını (öğelerini) belirleyin.
• değer = "" - form tarafından işlenmek üzere belirtilen URL'ye gönderilecek değeri içerir.
• seçili = "seçili" - örnek olarak bir liste öğesini vurgular.

Örnek HTML formu | Kaydırma çubuğuyla listeleme

size = "" özelliğinin değerini artırarak kaydırma çubuğuna sahip bir liste elde ederiz:

Birinci konum İkinci konum Üçüncü konum Dördüncü konum

İlk pozisyon İkinci konum Üçüncü konum Dördüncü konum

Bu seçenek için birden fazla konumun seçilmesini mümkün kılan multiple="multiple" bayrağını kullanın. Onun yokluğu yalnızca bir öğe seçmenizi sağlar.

type = "gönder" - bir düğmeyi tanımlar.

type = "reset" - bir sıfırlama düğmesini tanımlar.

value = "" - düğmedeki etiketi tanımlar.

Ayrıca bakınız:

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'ye ayrılmış bir eğitimde formlardan bahsetmek oldukça zordur. Nedeni çok basit: Bir HTML formu oluşturmak, HTML formunun bilgi göndereceği "dış dünyadaki noktayı" oluşturmaktan çok daha kolaydır. Çoğu durumda böyle bir "nokta" Perl veya C'de 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, uygun programlama dili ve Unix işletim sisteminin yetenekleri hakkında iyi bilgi sahibi olmayı gerektirir.

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

HTML formları bilgileri işleyici programlara [değişken adı]=[değişken değeri] çiftleri biçiminde iletir. Değişken isimleri Latin harfleriyle belirtilmelidir. 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 etiketiyle açılır

ve etiketiyle bitiyor

. Bir HTML belgesi birden fazla form içerebilir ancak formlar iç içe yerleştirilmemelidir. Etiketler de dahil olmak üzere HTML metni, kısıtlama olmaksızın formların içine yerleştirilebilir.

Etiket

biri gerekli olan üç özellik içerebilir. Bunlar niteliklerdir:

Gerekli özellik. Form işleyicisinin nerede bulunduğunu belirler.

Formdaki verilerin işleyiciye nasıl (başka bir deyişle hangi hiper metin aktarım protokolü yöntemi kullanılarak) aktarılacağını belirler. Geçerli değerler METHOD=POST ve METHOD=GET'tir. Öznitelik değeri ayarlanmamışsa, varsayılan olarak METHOD=GET varsayılır.

HTML formundaki verilerin işleyiciye iletilmek üzere nasıl kodlanacağını belirler. Öznitelik değeri ayarlanmamışsa varsayılan değer ENCTYPE=application/x-www-form-urlencoded olur.

En basit HTML formu

Verilerin formdan işleyiciye aktarılması sürecini başlatmak için bir tür kontrole ihtiyaç vardır. Böyle bir kontrol gövdesi oluşturmak çok basittir:

Formun içinde böyle bir satırla karşılaşan tarayıcı, ekranda Gönder yazıtının bulunduğu bir düğme çizecektir (İngilizce "gönder" kelimesinden ikinci heceye vurgu yaparak "gönder" ifadesini okuyun), tıklandığında tüm veriler mevcut olacaktır. form, etikette tanımlanan işleyiciye aktarılacak .

Düğme üzerindeki etiket, VALUE="[Label] niteliğini girerek istediğiniz şekilde ayarlanabilir." (читается "вэлью" с ударением на первом слоге, от английского "значение"), например:!}

Artık basit bir HTML formu yazacak kadar bilgimiz var (örnek 11). Herhangi bir veri toplamayacaktır, sadece bizi bu bölümün metnine döndürecektir.

En basit hal

Düğmenin üzerine yerleştirilen yazı, gerekirse düğme tanımına NAME=[name] özelliği eklenerek işleyiciye aktarılabilir (İngilizce "name"den "name" okuyun), örneğin:

Böyle bir butona tıkladığınızda, işleyici diğer tüm verilerle birlikte Let's go! değerine sahip bir buton değişkeni 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 tıklattığı gönder düğmesine 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ı) belirten NAME=[name] niteliğini içermelidir. Ad belirtilmelidir sadece Latin harfleriyle. Çoğu öğe VALUE="[value] özelliğini içermelidir" , определяющий значение, которое будет передано обработчику под этим именем. Для элементов !} Ve ancak bu öznitelik isteğe bağlıdır çünkü karşılık gelen değişkenin değeri kullanıcı tarafından klavyeyi kullanarak girilebilir.

Temel eleman türleri :

TÜR=metin

Bir metin satırı girmek için bir pencere tanımlar. 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 girişi için 20 karakter genişliğinde bir pencere tanımlar. 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. Metin türüne kesinlikle benzer, yalnızca girilen metnin sembolleri yerine ekranda yıldız işaretleri (*) gösterilir. Örnek:

Parola girmek için 20 karakter genişliğinde bir pencere tanımlar. İ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. Ek bir işaretli öznitelik içerebilir (düğmenin işaretli olduğunu gösterir). Aynı adlara sahip bir grup radyo düğmesinde yalnızca bir etiketli radyo düğmesi bulunabilir.

Örnek:

9600 bps
14400 bps
28800 bps

9600 bps, 14400 bps ve 28800 bps etiketli üç radyo düğmesinden oluşan bir grubu tanımlar. Düğmelerden ilki başlangıçta 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ğerinde bir modem değişkeni iletilecektir.

TÜR=onay kutusu

İşaretin yapılabileceği bir kareyi tanımlar. Ek 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ı
Yerel ağ sunucuları
İnternet Sunucuları

Dört kareden oluşan bir grubu tanımlar. İkinci ve dördüncü kareler başlangıçta 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

Formu doldururken kullanıcının göremediği ve işleyiciye değiştirilmeden aktarılan gizli bir veri öğesini tanımlar. İşleyicinin formun hangi sürümüyle uğraştığını bilmesi için zaman zaman yeniden tasarlanan bir formda böyle bir öğenin bulunması bazen yararlı olabilir. Diğer olası kullanımları kendiniz kolayca bulabilirsiniz.

Örnek:

İşleyiciye 1.1 değeriyle iletilen gizli bir sürüm değişkenini tanımlar.

TİP=sıfırla

Tıklandığında HTML formunu orijinal durumuna döndüren bir düğmeyi tanımlar. Bu düğmeyi kullanırken işleyiciye hiçbir veri iletilmediğinden, sıfırlama düğmesinin name özelliği olmayabilir.

Örnek:

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

Elementlerin yanı sıra , 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 bir NAME niteliğini içerir.</p> <p>Etiket <SELECT>ayrıca 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 örneğe bakalım:</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>Bu parça üç öğeden oluşan bir menüyü tanımlar: Seçenek 1, Seçenek 2 ve Seçenek 3. Varsayılan olarak Seçenek 1 öğesi seçilidir. İşleyiciye, değeri seçenek1 (varsayılan), seçenek2 veya seçenek3 olabilecek bir seçim değişkeni aktarılacaktır.</p> <p>Zaten öğrendiğimiz her şeyden sonra element <TEXTAREA>oldukça basit görünebilir. Örneğin:</p><p> <TEXTAREA NAME=address ROWS=5 COLS=50>Ve işte adresiniz...

Tüm özellikler gereklidir. NAME özelliği, pencere 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, pencerenin varsayılan içeriğini temsil eder. Kullanıcı onu düzenleyebilir veya basitçe silebilir.

Pencerede Rusça harflerin olduğunu bilmek önemlidir bir 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 PHP'de küçük bir program yazdım ve bu program şu adreste yer alıyor:</p><p>Http://206.31.82.215/hp/nc/fd-win.pht</p><p>Kaynak verileri bu programa örnek 12'de açıklanan form aracılığıyla aktarılacaktır:</p><p> <HTML> <HEAD> <TITLE>Örnek 12</TITLE> </HEAD> <H1>Biraz daha karmaşık 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 bilgi sağlamak gerekli değildir. Gösteri amaçlı olarak hayali olanlar da 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">dişi <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. String 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ı İşleyiciyi Çalıştır düğmesine tıklarsa ne olur?</p> <p>Cevap basit. Aşağıdaki mesaj otomatik olarak user@mail.box adresine e-postayla 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, bir mesaj oluşturma ve onu göndermek için bir e-posta programı başlatma işinin tamamı aslında kullanıcının tarayıcısı tarafından üstleniliyor. Bu, kullanıcının İnternet erişim yapılandırmasının Köprü Metni Aktarım Protokolü ile Giden Posta Teslim 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 imkansız olsa bile ölümcül bir şey olmayacaktır. Tarayıcı yalnızca bir hata mesajı görüntüleyecektir.</p> <table width="635" border="0"><tr><td width="200"> </td><td> </td><td width="200"> </td> </tr></table> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast?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> </div> <div class="data"> <div class="data__top clearfix"> <div class="data__print"> <a href='javascript:window.print(); void 0;'>Fok</a> </div> </div> <div class="data__bottom clearfix"> <div class="data__share"> <script src="//yastatic.net/es5-shims/0.0.2/es5-shims.min.js"></script> <script src="//yastatic.net/share2/share.js"></script> <div class="ya-share2" data-services="vkontakte,facebook,odnoklassniki,moimir,gplus,twitter,evernote,whatsapp,skype"></div> </div> </div> </div> <div class="navi"> <a href="https://comuedu.ru/tr/solutions/kakoi-teg-ispolzuetsya-dlya-sozdaniya-spiska-opredelenii-html-numerovannyi-i.html" class="navi__prev"></a> <!-- /next_post --> <a href="https://comuedu.ru/tr/windows/chto-takoe-promokod-i-kak-on-rabotaet-kak-ispolzovat-promokody.html" class="navi__next"></a> <!-- /next_post --> </div> </div> </div> <div class="news-blocks clearfix"> <div class="news-block"> <div class="papers"> <div class="papers__title">Ayrıca ilginç:</div> <div class="papers__items"> <style> </style> <div class="papers__item"> <div class="papers__img"> <a href="https://comuedu.ru/tr/different/zavis-kompyuter-vyklyuchaetsya-chto-delat-kompyuter-zavis-i-ne-vyklyuchaetsya-chto-delat-nevernaya-nastr.html"><img src="/uploads/47a8b0c63b5d7d41dae62f903c3445ed.jpg" style="width:70px; height:70px;" / loading=lazy loading=lazy></a> </div> <div class="papers__ovh"> <div class="papers__name"> <a href="https://comuedu.ru/tr/different/zavis-kompyuter-vyklyuchaetsya-chto-delat-kompyuter-zavis-i-ne-vyklyuchaetsya-chto-delat-nevernaya-nastr.html">Bilgisayar dondu ve kapanmıyor!</a> </div> <div class="papers__category"> </div> </div> </div> <div class="papers__item"> <div class="papers__img"> <a href="https://comuedu.ru/tr/modems/nabor-form-html-html-formy-mnogostrochnoe-tekstovoe-pole--.html"><img src="/uploads/1b9deb911f7578d1d24d1e331a9c77b0.jpg" style="width:70px; height:70px;" / loading=lazy loading=lazy></a> </div> <div class="papers__ovh"> <div class="papers__name"> <a href="https://comuedu.ru/tr/modems/nabor-form-html-html-formy-mnogostrochnoe-tekstovoe-pole--.html">Form html kümesi. HTML formları. Çok satırlı metin alanı - etiket</a> </div> <div class="papers__category"> </div> </div> </div> <div class="papers__item"> <div class="papers__img"> <a href="https://comuedu.ru/tr/network/kak-otsledit-iphone-sposoby-i-sekrety-poisk-aifona-po-geolokacii-cherez.html"><img src="/uploads/5ba9fc4720f22a8cffa65ea0124c7f62.jpg" style="width:70px; height:70px;" / loading=lazy loading=lazy></a> </div> <div class="papers__ovh"> <div class="papers__name"> <a href="https://comuedu.ru/tr/network/kak-otsledit-iphone-sposoby-i-sekrety-poisk-aifona-po-geolokacii-cherez.html">Bir uygulama, EMEI veya özel programlar kullanarak bilgisayar aracılığıyla coğrafi konuma göre iPhone arama Bir program kullanarak iPhone nasıl bulunur</a> </div> <div class="papers__category"> </div> </div> </div> </div> </div> </div> <div class="news-block"> <div class="papers"> <div class="papers__title">Okumanızı öneririz:</div> <div class="papers__items"> <div class="papers__item"> <div class="papers__img"> <a href="https://comuedu.ru/tr/android/lg-l9-proshivka-sposoby-razblokirovki-zagruzchika-lg-optimus-l9.html"> <img width="50" height="50" src="/uploads/a6f2668d462935c90eca1f95be2c93c4.jpg" class="attachment-50 size-50 wp-post-image" alt="LG Optimus L9 önyükleyicinin kilidini açma yöntemleri" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papers__ovh"> <div class="papers__date">2024-02-12 00:09:57</div> <div class="papers__name"> <a href="https://comuedu.ru/tr/android/lg-l9-proshivka-sposoby-razblokirovki-zagruzchika-lg-optimus-l9.html">LG Optimus L9 önyükleyicinin kilidini açma yöntemleri</a> </div> </div> </div> <div class="papers__item"> <div class="papers__img"> <a href="https://comuedu.ru/tr/operating-systems/adb-devices-ne-vidit-esli-ddms-ne-vidit-adb-devices-v-eclipse-chto-delat.html"> <img width="50" height="50" src="/uploads/f0fe4f4dabdcbe2f5385bb26f5892ded.jpg" class="attachment-50 size-50 wp-post-image" alt="DDMS, Eclipse'de adb cihazlarını görmüyorsa" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papers__ovh"> <div class="papers__date">2024-02-12 00:09:57</div> <div class="papers__name"> <a href="https://comuedu.ru/tr/operating-systems/adb-devices-ne-vidit-esli-ddms-ne-vidit-adb-devices-v-eclipse-chto-delat.html">DDMS, Eclipse'de adb cihazlarını görmüyorsa</a> </div> </div> </div> <div class="papers__item"> <div class="papers__img"> <a href="https://comuedu.ru/tr/android/skachat-rasshirenie-yandeks-dlya-gugl-hrom-rasshireniya-dlya-yandeks-brauzera.html"> <img width="50" height="50" src="/uploads/f0263e6ce1e6116bcd0c2a00fd22e721.jpg" class="attachment-50 size-50 wp-post-image" alt="Google Chrome için Yandex uzantısını indirin" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papers__ovh"> <div class="papers__date">2024-02-11 00:06:50</div> <div class="papers__name"> <a href="https://comuedu.ru/tr/android/skachat-rasshirenie-yandeks-dlya-gugl-hrom-rasshireniya-dlya-yandeks-brauzera.html">Google Chrome için Yandex uzantısını indirin</a> </div> </div> </div> </div> </div> </div> </div> <div class="rate clearfix"> <div class="papers__title">Konunun devamı:</div> </div> <div class="rate clearfix"> <div class="rate__img"> <a href="https://comuedu.ru/tr/modems/kak-proshit-kastomnoi-proshivkoi-sony-xperia-p-pereproshivaem-sony-xperia-s-pomoshchyu.html"> <img width="150" height="150" src="/uploads/e149928eac5d2cbd8430b0a446131638.jpg" class="attachment-alm-thumbnail size-alm-thumbnail wp-post-image" alt="Flashtool kullanarak Sony Xperia'nın yanıp sönmesi" sizes="(max-width: 150px) 100vw, 150px" / loading=lazy loading=lazy> </a> </div> <div class="rate__ovh"> <div class="rate__label"> <span>Modemler</span> </div> <div class="rate__name"> <a href="https://comuedu.ru/tr/modems/kak-proshit-kastomnoi-proshivkoi-sony-xperia-p-pereproshivaem-sony-xperia-s-pomoshchyu.html">Flashtool kullanarak Sony Xperia'nın yanıp sönmesi</a> </div> <div class="rate__description"> <p>Sony Xperia P, Japon markasının Android 2.3'te çalışan bir akıllı telefonudur. Burada ürün yazılımını bulabilir, ayarları sıfırlayabilir, talimatları bulabilir ve ayrıca nasıl edinebileceğinize dair bilgi edinebilirsiniz...</p> </div> </div> </div> <!-- /next_post --> </div> <div class="button-menu"></div> <div class="page__right"> <div class="menu"> <div class="menu__exit">×</div> <ul> <li><a href="https://comuedu.ru/tr/category/wi-fi/" class="link-catalog">Wifi</a> </li> <li><a href="https://comuedu.ru/tr/category/linux/" class="link-catalog">Linux</a> </li> <li><a href="https://comuedu.ru/tr/category/windows/" class="link-catalog">pencereler</a> </li> <li><a href="https://comuedu.ru/tr/category/different/" class="link-catalog">Çeşitli</a> </li> <li><a href="https://comuedu.ru/tr/category/network/" class="link-catalog">Ağlar</a> </li> <li><a href="https://comuedu.ru/tr/category/smart-tv/" class="link-catalog">Akıllı televizyon</a> </li> <li><a href="https://comuedu.ru/tr/category/solutions/" class="link-catalog">Çözümler</a> </li> <li><a href="https://comuedu.ru/tr/category/android/" class="link-catalog">Android</a> </li> </ul> </div> <div id="husevi1" style="height:400px;width:290px;" align="center"></div> <div class="page__hidden-mobile"> <div class="papers"> <div class="papers__tabs"> <div class="active" data-eq="0">Yeni makaleler</div> <span>/</span> <div data-eq="1">Popüler</div> </div> <div class="papers__blocks"> <div class="papers__block active"> <div class="papers__items"> <div class="papers__item"> <div class="papers__img"> <a href="https://comuedu.ru/tr/internet/novogodnii-million-bilain-kupi-telefon-vyigrai-million-akciya-ot.html"> <img width="50" height="50" src="/uploads/04932c51bfe08e9fdcfb781eeffe2e8e.jpg" class="attachment-50 size-50 wp-post-image" alt="Beeline'dan Promosyon “Yeni Yıl milyonu!" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papers__ovh"> <div class="papers__date">2024-02-11 00:06:50</div> <div class="papers__name"> <a href="https://comuedu.ru/tr/internet/novogodnii-million-bilain-kupi-telefon-vyigrai-million-akciya-ot.html">Beeline'dan Promosyon “Yeni Yıl milyonu!</a> </div> <div class="papers__category"> <a href="https://comuedu.ru/tr/category/internet/">internet</a> </div> </div> </div> <div class="papers__item"> <div class="papers__img"> <a href="https://comuedu.ru/tr/computer/kakaya-antenna-dlya-interneta-ot-iota-luchshe-delaem-vneshnyuyu.html"> <img width="50" height="50" src="/uploads/dd132e75729aec098e23a064d5cef1f9.jpg" class="attachment-50 size-50 wp-post-image" alt="Yota sinyalini kendi ellerinizle güçlendirmek için harici bir anten yapmak 3g yota için ev yapımı antenler" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papers__ovh"> <div class="papers__date">2024-02-11 00:06:50</div> <div class="papers__name"> <a href="https://comuedu.ru/tr/computer/kakaya-antenna-dlya-interneta-ot-iota-luchshe-delaem-vneshnyuyu.html">Yota sinyalini kendi ellerinizle güçlendirmek için harici bir anten yapmak 3g yota için ev yapımı antenler</a> </div> <div class="papers__category"> <a href="https://comuedu.ru/tr/category/computer/">Bilgisayar</a> </div> </div> </div> <div class="papers__item"> <div class="papers__img"> <a href="https://comuedu.ru/tr/android/kak-vosstanovit-akkaunt-gugl-na-androide-esli-zabyl-parol-kak.html"> <img width="50" height="50" src="/uploads/cdb8356d55d23e54b94048e54f1a9681.jpg" class="attachment-50 size-50 wp-post-image" alt="Google hesabınızı (Google) nasıl kurtarırsınız - talimatları tamamlayın" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papers__ovh"> <div class="papers__date">2024-02-10 00:09:22</div> <div class="papers__name"> <a href="https://comuedu.ru/tr/android/kak-vosstanovit-akkaunt-gugl-na-androide-esli-zabyl-parol-kak.html">Google hesabınızı (Google) nasıl kurtarırsınız - talimatları tamamlayın</a> </div> <div class="papers__category"> <a href="https://comuedu.ru/tr/category/android/">Android</a> </div> </div> </div> <div class="papers__item"> <div class="papers__img"> <a href="https://comuedu.ru/tr/apple/kak-vosstanovit-vse-fotografii-na-kompyutere-mozhno-li.html"> <img width="50" height="50" src="/uploads/520825e53e5658bab3098fc7bb764887.jpg" class="attachment-50 size-50 wp-post-image" alt="Silinen fotoğrafları kurtarmak mümkün mü?" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papers__ovh"> <div class="papers__date">2024-02-10 00:09:22</div> <div class="papers__name"> <a href="https://comuedu.ru/tr/apple/kak-vosstanovit-vse-fotografii-na-kompyutere-mozhno-li.html">Silinen fotoğrafları kurtarmak mümkün mü?</a> </div> <div class="papers__category"> <a href="https://comuedu.ru/tr/category/apple/">Elma</a> </div> </div> </div> <div class="papers__item"> <div class="papers__img"> <a href="https://comuedu.ru/tr/computer/narisovat-sebe-avatarku-kak-sdelat-avatarku-dlya-gruppy.html"> <img width="50" height="50" src="/uploads/38f3edbcca49643308b2c6a9833215e8.jpg" class="attachment-50 size-50 wp-post-image" alt="VKontakte grubu için avatar nasıl yapılır?" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papers__ovh"> <div class="papers__date">2024-02-10 00:09:22</div> <div class="papers__name"> <a href="https://comuedu.ru/tr/computer/narisovat-sebe-avatarku-kak-sdelat-avatarku-dlya-gruppy.html">VKontakte grubu için avatar nasıl yapılır?</a> </div> <div class="papers__category"> <a href="https://comuedu.ru/tr/category/computer/">Bilgisayar</a> </div> </div> </div> <div class="papers__item"> <div class="papers__img"> <a href="https://comuedu.ru/tr/modems/perekodirovka-pulta-dlya-shlagbauma-kak-zaprogrammirovat-pult-ot.html"> <img width="50" height="50" src="/uploads/c9e93d7c8fe8c0646d6cfeec57f543b2.jpg" class="attachment-50 size-50 wp-post-image" alt="Kapı uzaktan kumandası nasıl programlanır" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papers__ovh"> <div class="papers__date">2024-02-10 00:09:22</div> <div class="papers__name"> <a href="https://comuedu.ru/tr/modems/perekodirovka-pulta-dlya-shlagbauma-kak-zaprogrammirovat-pult-ot.html">Kapı uzaktan kumandası nasıl programlanır</a> </div> <div class="papers__category"> <a href="https://comuedu.ru/tr/category/modems/">Modemler</a> </div> </div> </div> </div> </div> <div class="papers__block"> <div class="papers__items"> <div class="papers__item"> <div class="papers__img"><a href="https://comuedu.ru/tr/operating-systems/kak-perenesti-sistemu-na-novyi-disk-perenos-sistemy-na-drugoi.html"> <img width="50" height="50" src="/uploads/814fae98f39e5c932bd32e78a073a9b8.jpg" class="attachment-50x50 size-50x50 wp-post-image" alt="Sistemi başka bir veya yeni sabit sürücüye aktarma" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a></div> <div class="papers__ovh"> <div class="papers__name"> <a href="https://comuedu.ru/tr/operating-systems/kak-perenesti-sistemu-na-novyi-disk-perenos-sistemy-na-drugoi.html">Sistemi başka bir veya yeni sabit sürücüye aktarma</a> </div> <div class="papers__category"><a href="https://comuedu.ru/tr/category/operating-systems/" rel="tag">işletim sistemi</a></div> </div> </div> <div class="papers__item"> <div class="papers__img"><a href="https://comuedu.ru/tr/internet/kak-rabotat-v-ehele-sozdanie-formul-v-excel-ispolzovanie-teksta-v.html"> <img width="50" height="50" src="/uploads/4a4d0a6e568856d8bdd138d76af988ed.jpg" class="attachment-50x50 size-50x50 wp-post-image" alt="Excel'de nasıl çalışılır. Excel'de formül oluşturma. Formüllerde metin kullanma" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a></div> <div class="papers__ovh"> <div class="papers__name"> <a href="https://comuedu.ru/tr/internet/kak-rabotat-v-ehele-sozdanie-formul-v-excel-ispolzovanie-teksta-v.html">Excel'de nasıl çalışılır. Excel'de formül oluşturma. Formüllerde metin kullanma</a> </div> <div class="papers__category"><a href="https://comuedu.ru/tr/category/internet/" rel="tag">internet</a></div> </div> </div> <div class="papers__item"> <div class="papers__img"><a href="https://comuedu.ru/tr/windows/osobennosti-plagina-savefrom-net-dlya-yandex-obozrevatelya-pochemu-ne.html"> <img width="50" height="50" src="/uploads/ee92051e0a9939d97de495d81bdc2bfe.jpg" class="attachment-50x50 size-50x50 wp-post-image" alt="Tek bir Savefrom yetkilisi kullanarak YouTube'dan herhangi bir video nasıl indirilir" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a></div> <div class="papers__ovh"> <div class="papers__name"> <a href="https://comuedu.ru/tr/windows/osobennosti-plagina-savefrom-net-dlya-yandex-obozrevatelya-pochemu-ne.html">Tek bir Savefrom yetkilisi kullanarak YouTube'dan herhangi bir video nasıl indirilir</a> </div> <div class="papers__category"><a href="https://comuedu.ru/tr/category/windows/" rel="tag">pencereler</a></div> </div> </div> <div class="papers__item"> <div class="papers__img"><a href="https://comuedu.ru/tr/computer/stoit-li-udalyat-zashchitnik-windows-10-kak-polnostyu-otklyuchit-zashchitnik.html"> <img width="50" height="50" src="/uploads/d1578f551a01fcae7a7d695c6b12c017.jpg" class="attachment-50x50 size-50x50 wp-post-image" alt="Windows Defender nasıl tamamen devre dışı bırakılır (Microsoft Defender)" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a></div> <div class="papers__ovh"> <div class="papers__name"> <a href="https://comuedu.ru/tr/computer/stoit-li-udalyat-zashchitnik-windows-10-kak-polnostyu-otklyuchit-zashchitnik.html">Windows Defender nasıl tamamen devre dışı bırakılır (Microsoft Defender)</a> </div> <div class="papers__category"><a href="https://comuedu.ru/tr/category/computer/" rel="tag">Bilgisayar</a></div> </div> </div> <div class="papers__item"> <div class="papers__img"><a href="https://comuedu.ru/tr/wi-fi/krasivye-znachki-na-rabochii-stol-gde-skachat-ikonki-dlya-papok-i-kak-ih.html"> <img width="50" height="50" src="/uploads/dbf75d872069880ad883f776070eb592.jpg" class="attachment-50x50 size-50x50 wp-post-image" alt="Klasör simgeleri nereden indirilir ve nasıl yüklenir" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a></div> <div class="papers__ovh"> <div class="papers__name"> <a href="https://comuedu.ru/tr/wi-fi/krasivye-znachki-na-rabochii-stol-gde-skachat-ikonki-dlya-papok-i-kak-ih.html">Klasör simgeleri nereden indirilir ve nasıl yüklenir</a> </div> <div class="papers__category"><a href="https://comuedu.ru/tr/category/wi-fi/" rel="tag">Wifi</a></div> </div> </div> <div class="papers__item"> <div class="papers__img"><a href="https://comuedu.ru/tr/solutions/kakoi-teg-ispolzuetsya-dlya-sozdaniya-spiska-opredelenii-html-numerovannyi-i.html"> <img width="50" height="50" src="/uploads/8361afa2938822c4cbec12cc776b53d6.jpg" class="attachment-50x50 size-50x50 wp-post-image" alt="HTML: Numaralı ve Madde İşaretli Liste" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a></div> <div class="papers__ovh"> <div class="papers__name"> <a href="https://comuedu.ru/tr/solutions/kakoi-teg-ispolzuetsya-dlya-sozdaniya-spiska-opredelenii-html-numerovannyi-i.html">HTML: Numaralı ve Madde İşaretli Liste</a> </div> <div class="papers__category"><a href="https://comuedu.ru/tr/category/solutions/" rel="tag">Çözümler</a></div> </div> </div> </div> </div> </div> </div> <div class="comments"> <div id="husevi2" class="husevi-sticky" style="height:500px;width:254px;" align="center"></div> </div> </div> </div> </div> </div> </div> <div class="footer"> <div class="footer__top"> <div class="cnt"> <div class="footer__nav"> <ul> <li><a href="https://comuedu.ru/tr/feedback.html">Kişiler</a></li> <li><a href="">Reklam</a></li> <li><a href="">Site hakkında</a></li> </ul> </div> <div class="footer__counter"> </div> <div class="footer__logo1" align="right"> <img style="max-height:60px;" src="/assets/logo.png" alt="" loading=lazy loading=lazy> </div> </div> </div> <div class="footer__bottom"> <div class="cnt"> <div class="footer__copyright">© comuedu.ru 2024 Bilgisayar teknolojisi hakkında web sitesi</div> </div> </div> </div> <a href="#top" class="up"></a> </div> <script src="https://comuedu.ru/wp-content/themes/tehnika-expert/js/jquery-1.12.0.js"></script> <script src="https://comuedu.ru/wp-content/themes/tehnika-expert/js/owl.carousel.min.js"></script> <script src="https://comuedu.ru/wp-content/themes/tehnika-expert/js/mousewheel.js"></script> <script src="https://comuedu.ru/wp-content/themes/tehnika-expert/js/jscrollpane.min.js"></script> <script src="https://comuedu.ru/wp-content/themes/tehnika-expert/js/scripts.js?v=8"></script> <!--[if lt IE 10]> <script src="https://comuedu.ru/wp-content/themes/tehnika-expert/js/placeholder.js"></script> <![endif]--> <script type='text/javascript' src='https://comuedu.ru/wp-content/plugins/table-of-contents-plus/front.min.js?ver=1509'></script> <script type='text/javascript' src='https://comuedu.ru/wp-content/plugins/wp-ajaxify-comments/js/wp-ajaxify-comments.min.js?ver=1.5.0'></script> <script type='text/javascript' src='https://comuedu.ru/wp-content/plugins/wp-polls/polls-js.js?ver=2.73.8'></script> <script type='text/javascript' src='https://comuedu.ru/wp-content/plugins/wp-postratings/js/postratings-js.js?ver=1.85'></script> <script type='text/javascript' src='https://comuedu.ru/wp-content/plugins/wp_testme/js/testme.js?ver=1.1'></script> <script type='text/javascript' src='/wp-includes/js/comment-reply.min.js?ver=4.9'></script> <script type='text/javascript'> var q2w3_sidebar_options = new Array(); q2w3_sidebar_options[0] = { "sidebar" : "sidebar-2", "margin_top" : 10, "margin_bottom" : 112, "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" : ['cb_widget-2'] } ; </script> <script type='text/javascript' src='https://comuedu.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.9'></script> </body> </html>