CSS คอลัมน์
- หน้าก่อน CSS การแบ่งหน้า
- หน้าต่อไป CSS ส่วนตัวผู้ใช้
CSS การจัดเรียงบทความในแถวที่มีหลายช่อง
CSS การจัดเรียงบทความในแถวที่มีหลายช่องสามารถใช้งานง่ายๆ เช่น หนังสือพิมพ์นั้น
เรื่องสามประมง
ชาติแรก
การเลี้ยงที่ป่ายอม มหาธรรมชาติแห่งสามเจ้าพี่และสามนาย
ชัยชนะในการตัดศัลยศิลป์แห่งตัวยงตัวแรก
ว่าทั้งหมดสิ่งที่มีอำนาจในโลกมีสิ่งที่แยกแยะมากแล้วจะมากพอดีและสิ่งที่มากพอดีก็จะแยกแยะอีกเช่น ระหว่างจุดสิ้นสุดของยุคหลังของจีนหรือชาติเจ็ดที่แยกแยะออกมา มาสู่ไทย และหลังจากที่ไทยเสร็จงานแล้ว ชาวจีนแดงและชาวจีนแสนแข็งได้แยกแยะออกมาอีก และเข้าสู่ฝ่ายฮัน ฝ่ายฮันที่เป็นจีนมีฝ่ายก่อตั้งและฝ่ายฮันที่สูงสุดได้มาเป็นฝ่ายฮัน และหลังจากที่หลุยดิ้นฟ้าตายแล้ว หลังจากที่หลุยดิ้นฟ้าขึ้นครองราชย์แล้ว นายพลหวันหง นายพลเฉลี่ย ฉานและนายพลฉันฝันได้ช่วยปกครองราชย์พร้อมกัน ณ ขณะนั้น มีนายพลฝายและอื่นๆที่เชื่อฝายเองที่มีอำนาจที่จะใช้เป็นตัวมีอำนาจ หวันหงและฉันฝันเจตนาทำลายฝาย แต่เนื่องจากความลับไม่มีความเป็นส่วนตัวที่ถูกทำลายด้วยตัวเอง จึงถูกฝายฝ่ายเองทำร้ายตาย จากนั้นมา นายหลวงหลวงและอื่นๆที่มีอำนาจมีอำนาจยิ่งเพิ่มขึ้น ในวันที่เดือนเมษายนของปีเดือนเดือนที่สอง กษัตริย์ยังทรงเข้าสู่พระราชวังวันดินร้อน เมื่อกำลังขึ้นที่ที่นั่งของตน มีลมแรงพุ่งเข้ามาจากบริเวณหน้าต่างทางด้านขวาของพระราชวัง พระองค์เห็นเงางามของหมวกสีเขียวยาวโดยสูงขึ้นมาจากหลังคา พุ่งตกลงมาเอยอยู่บนเก้าอี้ของพระองค์ พระองค์ก็ตะลึงหลงและบรรดาเจ้าหน้าที่ต่างก็หลบหนีออกไป ในทันทีหลังจากนั้น หมวกสีเขียวก็หายไปเสียไป แล้วอย่างไรก็ตาม เมื่อมีลมที่รุนแรงและน้ำฝนตกและหิมะตกเช่นนั้น ตลอดจนตอนคืนก็ยังตกมา ทำลายบ้านเรือนหลายหลัง ในปีเดือนเดือนที่สองของรัชสมัยหวันหง หลวงองค์หลวงและเจ้าหน้าที่แห่งกรุงหลวงหลายๆคนเกิดความรุนแรงในเมืองหลวง และทะเลสาบของมหาสมุทรไทยได้หลุดออกมาและทำให้บรรดาผู้อาศัยติดชาติชาวชายของชายทะเลถูกยังน้ำทะเลเข้าไป ในปีฉันฝันของปีหนึ่ง ตัวหญิงชนะตายที่แปลงเป็นหญิง ในวันขึ้นปีที่หนึ่ง มีอายุเงาดำมากกว่าสิบหลายเมตร บินเข้าไปที่ห้องวันดินร้อน ในเดือนกรกฎาคมในปีหนึ่ง มียางขึ้นบนหอบางเล็ก และฝั่งสันหลังของแหลมวันหนึ่งที่หัก มีหลายสิ่งที่เป็นปรากฏวิญญาณ ไม่แต่สิ่งเดียวที่หนึ่งเท่านั้น พระเจ้าได้ประกาศสั่งของแก่เจ้าหน้าที่ทุกคนว่า ว่าเหตุผลของเหตุปรากฏวิญญาณ นายพลเฉลี่ย หยวนทำให้มีนายพลเฉลี่ย หยวนขึ้นมากับรายงานว่า ในตอนที่เกิดหมวกและหญิงชนะตายที่แปลงเป็นหญิง มันเป็นสาเหตุที่มาจากการที่ราชินีหญิงมีอำนาจเป็นเรื่องปกครองราชย์ พระองค์ได้ทรงดูรายงานและสวนทัยด้วยนัยที่เป็นเหตุผล ฝายในบริเวณที่หลังเข้ามาดูแลข้างหลังได้รับรายงานทั้งหมดและแจ้งแก่บรรดาเจ้าหน้าที่เหล่านั้นแล้ว จึงทำให้เฉลี่ย หยวนตกเป็นขาดและทำให้เขาหลบหนีไปปลูกนา หลังจากนั้น ฝายแห่งปัจจุบัน และฝายแห่งหลายๆคนมีการเป็นที่แยกแยะออกมาและเป็นมิตรที่มีอำนาจมาก และทำร้ายกันเพื่อเจ้าหน้าที่สิบคนที่มีอำนาจที่เรียกว่า
...... ......
CSS คุณสมบัติมากลอย
在本章中,您将学到以下多列属性:
column-count
column-gap
column-rule-style
column-rule-width
column-rule-color
column-rule
column-span
column-width
浏览器支持
...... ......
คุณสมบัติ | ...... ...... | ในบทนี้คุณจะเรียนรู้คุณสมบัติมากลอยต่อไปนี้: | การสนับสนุนโปรแกรมบราวเซอร์ | ตัวเลขในตารางแสดงรุ่นเบราเซอร์แรกที่สนับสนุนคุณสมบัตินี้อย่างเต็มที่。 | Chrome |
---|---|---|---|---|---|
column-count | Firefox | Safari | Opera | 71.0 | 50.0 |
column-gap | Firefox | Safari | Opera | 71.0 | 50.0 |
column-rule | Firefox | Safari | Opera | 71.0 | 50.0 |
column-rule-color | Firefox | Safari | Opera | 71.0 | 50.0 |
column-rule-style | Firefox | Safari | Opera | 71.0 | 50.0 |
column-rule-width | Firefox | Safari | Opera | 71.0 | 50.0 |
column-span | Firefox | Safari | IE | 71.0 | 50.0 |
column-width | Firefox | Safari | Opera | 71.0 | 50.0 |
CSS สร้างคอลัมน์
column-gap
คุณสมบัติกำหนดจำนวนคอลัมน์ที่ตัวองค์ประกอบควรแบ่งตาม。
ตัวอย่างด้านล่างแบ่งข้อความที่อยู่ใน <div> ออกเป็น 3 คอลัมน์:
ตัวอย่าง
div { CSS กำหนดช่องว่างระหว่างคอลัมน์ }
คุณสมบัติกำหนดช่องว่างระหว่างคอลัมน์。
column-rule-style
ตัวอย่างด้านล่างกำหนดช่องว่างระหว่างคอลัมน์ 40 พิกเซล:
ตัวอย่าง
div { column-gap: 40px; }
column-rule-width
CSS กฎระหว่างคอลัมน์
ตัวอย่าง
div { คุณสมบัติกำหนดสไตล์ของกฎระหว่างคอลัมน์: }
column-rule-color
คุณสมบัติกำหนดความกว้างของกฎระหว่างคอลัมน์:
ตัวอย่าง
div { คุณสมบัติกำหนดสีของกฎระหว่างคอลัมน์: }
คุณสมบัติ column-rule คือคุณสมบัติย่อที่ใช้ตั้งค่าคุณสมบัติ column-rule-* ทั้งหมดข้างต้น。
ตัวอย่างด้านล่างกำหนดความกว้าง สไตล์ และสีของกฎระหว่างคอลัมน์:
ตัวอย่าง
div { column-rule: 1px solid lightblue; }
กำหนดองค์ประกอบควรข้ามลอยคอลัมน์เท่าไหร่
column-span
คุณสมบัติกำหนดองค์ประกอบควรข้ามลอยคอลัมน์เท่าไหร่。
ตัวอย่างด้านล่างกำหนด <h2> องค์ประกอบควรข้ามทุกคอลัมน์:
ตัวอย่าง
h2 { column-span: all; }
กำหนดความกว้างของคอลัมน์
column-width
คุณสมบัติกำหนดความกว้างที่แนะนำสำหรับคอลัมน์。
ตัวอย่างด้านล่างกำหนดความกว้างที่แนะนำสำหรับคอลัมน์ควรเป็น 100px:
ตัวอย่าง
div { column-width: 100px; }
CSS คุณสมบัติมากลอย
ตารางด้านล่างระบุคุณสมบัติมากลอยใน CSS ทั้งหมด:
คุณสมบัติ | รายละเอียด |
---|---|
column-count | กำหนดจำนวนคอลัมน์ที่ตัวองค์ประกอบควรแบ่งตาม。 |
column-fill | กำหนดวิธีที่จะกระจายคอลัมน์。 |
column-gap | กำหนดช่องว่างระหว่างคอลัมน์。 |
column-rule | ใช้เพื่อตั้งค่าคุณสมบัติ column-rule-* ทั้งหมดด้วยรูปแบบย่อ。 |
column-rule-color | กำหนดสีของกฎระหว่างคอลัมน์。 |
column-rule-style | กำหนดสไตล์ของกฎระหว่างคอลัมน์。 |
column-rule-width | กำหนดความกว้างของกฎระหว่างคอลัมน์。 |
column-span | กำหนดว่าตัวแปรควรข้ามคอลัมน์เท่าไหร่ |
column-width | กำหนดความกว้างที่สุดที่แนะนำสำหรับคอลัมน์ |
columns | ใช้แบบลัพธ์สั้นเพื่อตั้งค่า column-width และ column-count |
- หน้าก่อน CSS การแบ่งหน้า
- หน้าต่อไป CSS ส่วนตัวผู้ใช้