สร้างการสืบค้นปริมาณ CSS ด้วยตัวสร้าง QQ
นักพัฒนาบางคนรู้หรือใช้ แบบสอบถามปริมาณ CSS บนเว็บไซต์ของพวกเขา มันเป็นคุณสมบัติที่ค่อนข้างซับซ้อน แต่ก็มีประโยชน์เมื่อคุณ มีรายการที่แตกต่างกันในภาชนะ.
แบบสอบถามปริมาณสามารถ เปลี่ยน / อัปเดตคุณสมบัติ CSS ขึ้นอยู่กับ ข้อ จำกัด ที่กำหนดไว้ล่วงหน้าสำหรับองค์ประกอบย่อย. ตัวอย่างเช่นถ้าคุณมี มากกว่าสามรายการ ในรายการคุณอาจทำให้แบบอักษรเล็กลงเพื่อประหยัดพื้นที่ อีกตัวอย่างหนึ่งคือ อัปเดตความกว้างของลิงค์ ขึ้นอยู่กับ จำนวนลิงก์ ในเมนูนำทาง.
งานเช่นนี้สามารถ ซับซ้อนขึ้นอย่างรวดเร็ว แต่ต้องขอบคุณ เครื่องมือสร้างแบบสอบถามปริมาณ คุณไม่จำเป็นต้องจดจำไวยากรณ์ที่สับสนใด ๆ.
เว็บแอพนี้ สร้างรหัสทั้งหมดสำหรับคุณ เพื่อประหยัดเวลา คุณจำเป็นต้อง เลือกจากสามเมนูแบบเลื่อนลง ที่ปรับแต่งแบบสอบถามปริมาณของคุณ พวกเขาทำงานเช่นนี้:
- ผู้เลือก - องค์ประกอบลูกใดที่ควรนับ
- ประเภทการสืบค้น - เลือกระหว่าง “ที่มากที่สุด”, “อย่างน้อย”, หรือคอมโบของ “ที่มากที่สุด” & “อย่างน้อย”
- จำนวน - จำนวนรายการทั้งหมดที่จะกรอง
ดูเหมือนว่าสับสนในรหัส แต่มันเป็นแนวคิดที่ง่ายมาก การสืบค้นปริมาณช่วยให้คุณใช้คุณสมบัติ CSS ขึ้นอยู่กับจำนวนองค์ประกอบลูกทั้งหมด.
คุณสามารถ เพิ่มสไตล์ CSS บางอย่าง เมื่อมีให้พูด, อย่างน้อย 4 องค์ประกอบย่อย (4 หรือมากกว่า) หรือคุณสามารถ เพิ่มสไตล์เฉพาะเมื่อ มี ที่มากที่สุด 4 องค์ประกอบย่อย (0-4 ลูก).
ตัวเลือกคำสั่งผสมช่วยให้คุณกำหนด จำนวนเด็กขั้นต่ำและสูงสุดที่แน่นอน จำเป็นต้องแสดงคุณสมบัติ CSS บางอย่าง.
ในตัวอย่างบนหน้าจอด้านบนฉันได้ตั้งค่า ทั้งหมด “ที่มากที่สุด” รายการ ถึง 2 ซึ่งหมายความว่าเมื่อฉันมีลูก 0, 1 หรือ 2 ลูกบล็อกจะเป็นสีแดง ถ้าฉันเพิ่มอีกหนึ่งลูกเพื่อให้ได้ 3 ลูกบล็อกทั้งหมดจะเปลี่ยนเป็นสีน้ำเงิน.
หากคุณไม่รู้ว่าเกิดอะไรขึ้นคุณสามารถ คลิกกล่องข้อมูลขนาดเล็ก ในแถบด้านข้าง มันจะทำให้ หน้าต่างโมดอลพร้อมข้อเท็จจริงและไวยากรณ์ อธิบายคุณสมบัติการสืบค้นปริมาณ.
นี่เป็นเครื่องมือที่มีประโยชน์มากสำหรับ ทั้งผู้เริ่มต้นและนักพัฒนาที่มีประสบการณ์. มันจะ ประหยัดเวลาได้มาก ในระยะยาวและมันจะช่วยคุณ สร้างเว็บไซต์แบบไดนามิกมากขึ้น.
ในการเริ่มต้นเยี่ยมชมเว็บไซต์ QQ builder และ เริ่มต้นปรับแต่งคุณสมบัติของคุณ. คุณสามารถ ของเล่นที่มีผลลัพธ์ และ ตรวจสอบตัวอย่างสด ในบานหน้าต่างด้านขวาเพื่อเรียนรู้ว่าการเปลี่ยนแปลงของคุณมีผลกับองค์ประกอบย่อยอย่างไร.
โครงการนี้ยัง มีอยู่ใน GitHub ดังนั้นคุณมีอิสระที่จะ ตรวจสอบซอร์สโค้ด หรือแม้กระทั่ง ดาวน์โหลดสำเนาในเครื่อง. และถ้าคุณรักแอพนี้หรือมีคำถาม / คำแนะนำสำหรับผู้สร้าง Drew Minns คุณสามารถยิงทวีตเร็ว ๆ นี้ @drewisthe.