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 ความชัดเจน

แผงมูลนิธิ

แผงมูลนิธิเป็นขอบสีเทาเนื้อหาที่มีโมดูล padding คุณสามารถใช้ .panel ระดับการสร้าง:

ตัวอย่าง

<ระดับ Div = "แผง">
<H3> ชื่อ </ h3>
<p> ข้อความ .. </ p>
</ div>

ลอง»

แผงสี

ใช้ .callout แผงสีชั้นเปลี่ยนเป็นสีฟ้าอ่อน:

ตัวอย่าง

<ระดับ Div = "แผงไฮไลต์" >
<H3> ชื่อ </ h3>
<p> ข้อความ .. </ p>
</ div>

ลอง»

แผงโค้งมน

ใช้ .radius ระดับชุดเนื้อแผง:

ตัวอย่าง

<ระดับ Div = "แผงรัศมี" >
<H3> ชื่อ </ h3>
<p> ข้อความ .. </ p>
</ div>

ลอง»

แผงที่กำหนดเอง

คุณสามารถใช้ CSS ในการปรับแต่งแผงตัวอย่างต่อไปนี้เราจะเป็นแผงบัตร:

ตัวอย่าง

<style>
.panel {
padding: 0;
ชายแดน: none;
ความกว้าง: 50%;
}
div.container {
text-align: ศูนย์;
padding: 15px;
ขอบด้านบน: 20px;
}
img {
ความกว้าง: 100%;
}
</ style>

<ระดับ Div = "แผง">
<img src = "http://www.w3big.com/wp-content/uploads/2015/11/20121204024112919.jpg" alt = "Cinque Terre">
<ระดับ Div = "ภาชนะ">
<H4> Great Wall </ h4>
<p> ผู้ที่ไม่เคยได้รับการมหาราช ผนังไม่ได้เป็นคนจริง ! ! ! </ p>
</ div>
</ div>

ลอง»