Latest web development tutorials
×

Foundation หลักสูตร

Foundation หลักสูตร Foundation เริ่มต้น Foundation ข้อความ Foundation ตาราง Foundation ปุ่มกด Foundation กลุ่มปุ่ม Foundation ไอคอน Foundation ฉลาก Foundation กล่องแจ้งเตือน Foundation แถบความคืบหน้า Foundation แผงหน้าปัด Foundation ภาพ Foundation เมนูแบบเลื่อนลง Foundation รายการพับ Foundation รายการ Foundation แถบ Foundation เพจจิ้ง Foundation ดัชนีราคาสินค้า Foundation แถบนำทางด้านบน Foundation แถบด้านข้าง Foundation นำทางสไลด์(Off-Canvas) Foundation Magellan Foundation ฟอร์ม Foundation ขนาดของกรอบการป้อนข้อมูล Foundation สวิตซ์ Foundation Slider Foundation ลูกโป่ง Foundation กล่อง Modal Foundation Joyride Foundation ควอไลเซอร์

Foundation กินกัน

Foundation ระบบกริด Foundation กินกัน - ซ้อนกันในแนวนอน Foundation กินกัน - อุปกรณ์ขนาดเล็ก Foundation กินกัน - อุปกรณ์ขนาดกลาง Foundation กินกัน - อุปกรณ์ขนาดใหญ่ Foundation บล็อกตาราง Foundation ตัวอย่างตาราง

Foundation คู่มืออ้างอิง

Foundation คู่มืออ้างอิงไอคอน Foundation CSS คู่มืออ้างอิง Foundation CSS ความชัดเจน

สวิทช์มูลนิธิ

สวิทช์คือการคลิกเมาส์ (นิ้วแตะ) ภายใต้สลับไปมาระหว่าง "On" และ "ปิด" รัฐ:

สลับไปใช้ <div class="switch"> สร้าง <div> เพิ่มด้วย ID ที่ไม่ซ้ำกันภายใน <input type="checkbox"> , <label> องค์ประกอบสำหรับแอตทริบิวต์ต้อง <input type="checkbox"> ID ของการแข่งขัน:

ตัวอย่าง

<ระดับ Div = "สวิทช์">
<input id = "mySwitch" type = "ช่องทำเครื่องหมาย">
<label สำหรับ = "mySwitch"> </ label>
</ div>

ลอง»

ขนาดสวิทช์

ใช้ .large , .small หรือ .tiny ระดับการกำหนดขนาดสวิทช์:

ตัวอย่าง

<div class = "สลับใหญ่" > ... </ div>
<div class = "สวิทช์"> ... </ div>
<div class = "สลับเล็ก" > ... </ div>
<div class = "สลับเล็ก" > ... </ div>

ลอง»

สวิทช์เนื้อ

ใช้ .radius และ .round ระดับตั้งสวิตช์เนื้อ:

ตัวอย่าง

<div class = "สวิทช์"> ... </ div>
<div class = "สวิทช์รัศมี" > ... </ div>
<div class = "สวิทช์รอบ" > ... </ div>

ลอง»

กลุ่มสวิทช์

คุณสามารถตั้งค่าตัวเลือกของแต่ละบุคคลโดยการตั้งค่าปุ่ม (วิทยุ) หมายเหตุ: โปรดทราบว่าแต่ละตัวเลือก name แอตทริบิวต์จะต้องเหมือนกัน (เช่น "myGroup")

ตัวอย่าง

<ระดับ Div = "สวิทช์">
<input id = "mySwitch1" type = "วิทยุ" ชื่อ = "myGroup">
<label สำหรับ = "mySwitch1"> </ label>
</ div>

<ระดับ Div = "สวิทช์">
<input id = "mySwitch2" type = "วิทยุ" ชื่อ = "myGroup" การตรวจสอบ>
<label สำหรับ = "mySwitch2"> </ label>
</ div>

ลอง»