วิธีการใช้แอตทริบิวต์แบบฟอร์ม HTML ขั้นสูงให้ดีที่สุด



บทความนี้จะแนะนำคุณเกี่ยวกับแอตทริบิวต์ของฟอร์ม HTML ขั้นสูงและในระหว่างดำเนินการจะสาธิตการใช้งานจริง

เห็นได้ชัดว่าเป็นสิ่งแรกที่เกิดขึ้นในใจหลังจากฟังคำว่า www. โดยพื้นฐานแล้วมันเป็นสิ่งที่อยู่เบื้องหลังแต่ละเว็บไซต์ที่คุณเยี่ยมชมในปัจจุบัน ในบทความนี้เราจะสำรวจแอตทริบิวต์แบบฟอร์ม HTML ขั้นสูง

คำแนะนำต่อไปนี้จะกล่าวถึงในบทความนี้





ดังนั้นให้เราเริ่มต้นด้วยบทความนี้

แอตทริบิวต์แบบฟอร์ม HTML ขั้นสูง

HTML เพียงอย่างเดียวไม่สามารถทำให้เกิดความยุติธรรมกับการออกแบบที่เป็นที่ชื่นชอบมากที่สุดที่เราเห็นในปัจจุบัน มันต้องการความช่วยเหลือและมีให้โดย CSS หรือ Cascading Style Sheet . HTML และ CSS สามารถใช้ร่วมกันเพื่อสร้างหน้าเว็บที่น่าสนใจ



ไปต่อกับบทความนี้เกี่ยวกับแอตทริบิวต์แบบฟอร์ม HTML ขั้นสูง

แท็กและแอตทริบิวต์ใน HTML

ทั้งสองอย่างนี้เป็นพื้นฐานของ HTML และทั้งคู่ทำงานร่วมกัน แต่ทำหน้าที่ต่างกัน

แท็ก: แท็กใช้เพื่อทำเครื่องหมายจุดเริ่มต้นขององค์ประกอบ HTML และล้อมรอบด้วยวงเล็บเหลี่ยม



ตัวอย่าง:

แท็กด้านบนคือแท็กหัวเรื่องใน HTML

แอตทริบิวต์: นี่คือข้อมูลเพิ่มเติมเกี่ยวกับแท็กและระบุไว้ในแท็ก



ตัวอย่าง:

 ”My

แท็กด้านบนคือแท็กรูปภาพ และ alt เป็นแอตทริบิวต์สำหรับแท็กและให้คำอธิบายสำหรับรูปภาพ hello_world.jpg

ตามที่เราได้พูดถึงพื้นฐานที่เราต้องการดังนั้นตอนนี้เราสามารถก้าวไปอีกขั้นด้วยแรงจูงใจของบทความนี้ซึ่งเป็นแท็ก HTML และ CSS ขั้นสูง

ไปต่อกับบทความนี้เกี่ยวกับแอตทริบิวต์แบบฟอร์ม HTML ขั้นสูง

Max, Maxlength และ Min Attributes

สิ่งเหล่านี้เป็นคุณสมบัติของแท็กอินพุตโดยเฉพาะเช่น โดยทั่วไปแล้วแท็กอินพุตจะใช้ภายในแท็กเพื่อรับอินพุตประเภทต่างๆจากผู้ใช้เช่นข้อความตัวเลขปุ่มตัวเลือกวันที่ช่องทำเครื่องหมายเวลารหัสผ่านเป็นต้น

สูงสุด

แอ็ตทริบิวต์นี้ระบุค่าสูงสุดสำหรับอินพุตที่ระบุ หากผู้ใช้พยายามป้อนมากกว่าค่าสูงสุดผู้ใช้จะไม่ยอมรับอักขระหรือค่าในภายหลัง

บันทึก:

วิธีตั้งค่า classpath ใน java

แอตทริบิวต์ Max ถูกนำมาใช้กับ HTML 5

ตัวอย่าง:

จำนวนนักเรียน:

GitHub Gist Link:

มูลค่าของนักเรียนไม่สามารถเพิ่มได้เกิน 50

เอาต์พุต - แอตทริบิวต์ฟอร์ม HTML ขั้นสูง - Edureka

บันทึก: การดำเนินการแอตทริบิวต์ของแท็กระบุว่าข้อมูลที่ป้อนจะถูกส่งไปที่ใดสำหรับกระบวนการต่อไป ในกรณีนี้คือ submit_detail.php ซึ่งเป็นไฟล์ PHP

จำนวนนักเรียนคือรายละเอียดที่ต้องกรอกในกล่องข้อความ

แอตทริบิวต์สูงสุดในแท็กแรกระบุค่าตัวเลขสูงสุดที่สามารถป้อนในกล่องข้อความซึ่งเป็นค่าที่มากกว่า 50 จะไม่ได้รับการยอมรับซึ่งเป็นแรงจูงใจหลักของแอตทริบิวต์สูงสุด

นอกจากนี้ยังสามารถใช้แท็กสูงสุดเพื่อกำหนดวันที่สูงสุดซึ่งผู้ใช้สามารถป้อนลงในช่องป้อนข้อมูลได้

ตัวอย่าง:

ป้อนวันเกิดของคุณในรูปแบบปปปป - ดด - วว: 
DOB สูงสุด: 2000-03-31

GitHub Gist Link:

เราได้ใช้ 31เซนต์เดือนมีนาคมของปี 2000 เป็นวันที่สูงสุดและตัวเลือกคือปฏิทินจะถูก จำกัด จนถึงวันนั้นเท่านั้น

ในช่องป้อนข้อมูลนี้ผู้ใช้จะไม่สามารถป้อนวันที่ซึ่งอยู่หลังวันที่ที่ระบุในแอตทริบิวต์สูงสุด

ไปต่อกับบทความนี้เกี่ยวกับแอตทริบิวต์แบบฟอร์ม HTML ขั้นสูง

ตัดแต่ง () ใน java

ความยาวสูงสุด

ตามชื่อที่แนะนำแอตทริบิวต์นี้ระบุความยาวสูงสุดของอักขระที่ผู้ใช้สามารถป้อนลงในช่องอินพุตได้ ค่าแอตทริบิวต์คือตัวเลข

ตัวอย่าง:

ป้อนชื่อผู้ใช้ของคุณ:

GitHub Gist Link:

ขีด จำกัด ของช่องป้อนข้อมูลคือ 15 อักขระดังนั้นอินพุตจึง จำกัด ไว้ที่ 15 อักขระเท่านั้น

แอตทริบิวต์ความยาวสูงสุดนี้ในแท็กจะ จำกัด ผู้ใช้ในการป้อนข้อมูลที่ไม่เกินค่าที่ระบุซึ่งเป็น 15 อย่างเคร่งครัด

บันทึก ค่าดีฟอลต์ของแอ็ตทริบิวต์ maxlength คือ 524288

ไปต่อกับบทความนี้เกี่ยวกับแอตทริบิวต์แบบฟอร์ม HTML ขั้นสูง

นาที

แอตทริบิวต์ min ระบุค่าต่ำสุดสำหรับค่าที่จะป้อนในฟิลด์อินพุต

ตัวอย่าง:

ป้อนอายุ:

GitHub Gist Link:

แอตทริบิวต์ min ในแท็กอินพุตกำหนดว่าอายุอินพุตต้องไม่น้อยกว่า 18

เคล็ดลับ: คุณสามารถใช้ทั้งแอตทริบิวต์ min และ max กับอินพุตเพื่อให้อินพุตเป็นช่วงกฎหมายหรือช่วงที่ยอมรับได้

ตัวอย่าง:

ป้อนอายุ:

GitHub Gist Link:

ด้วยเหตุนี้เราจึงมาถึงตอนท้ายของบทความนี้ใน Advanced HTML Form Attributes

โทเค็น Java คืออะไร

ตอนนี้ช่วงของอินพุตในฟิลด์ต้องไม่น้อยกว่า 18 และมากกว่า 50 ในเวลาเดียวกันแอ็ตทริบิวต์ max และ min สามารถใช้ได้กับอินพุตหลายประเภทเช่น number, range, date, datetime, datetime -local, month, time และ week

ตอนนี้คุณรู้แล้วว่า HTML คืออะไรลองดูไฟล์ โดย Edureka การฝึกอบรมการรับรองการพัฒนาเว็บจะช่วยให้คุณเรียนรู้วิธีสร้างเว็บไซต์ที่น่าประทับใจโดยใช้ HTML5, CSS3, Twitter Bootstrap 3, jQuery และ Google API และปรับใช้กับ Amazon Simple Storage Service (S3)

มีคำถามสำหรับเรา? โปรดระบุไว้ในส่วนความคิดเห็นของบทความแล้วเราจะติดต่อกลับไป