CSS จัดเนื้อหาแอตทริบิวต์ คืออะไร และใช้งานอย่างไร?

บทช่วยสอน CSS จัดเนื้อหาแอตทริบิวต์ ที่ดีที่สุดในปี 2024 ในบทช่วยสอนนี้ คุณสามารถเรียนรู้ ตัวอย่าง,สนับสนุนเบราว์เซอร์,ความหมายและการใช้งาน,CSS ไวยากรณ์,ผิดนัด,บทความที่เกี่ยวข้อง,

CSS จัดเนื้อหาแอตทริบิวต์

ก่อนหน้านี้: CSS นิเมชั่น

ถัดไป: CSS คุณสมบัติจัดรายการ-

CSS อ้างอิง

ตัวอย่าง

จัดกล่องยืดหยุ่น <div> รายการองค์ประกอบ:

div
{
display: flex;
flex-flow: row wrap;
align-content:space-around;
}

ลอง»

สนับสนุนเบราว์เซอร์

ตัวเลขในตารางเป็นตัวแทนของเบราว์เซอร์แรกที่สนับสนุนหมายเลขรุ่นทรัพย์สิน

ทันทีหลังจาก -webkit- ดิจิตอล -ms- หรือ -moz- หลังจากรุ่นแรกที่จะสนับสนุนคุณสมบัติคำนำหน้า

คุณสมบัติ
จัดเนื้อหา	21.0	11.0	28.0	9.0 7.0 -webkit-	12.1

ความหมายและการใช้งาน

สอดคล้องภายในภาชนะ (แนวตั้ง) เมื่อจัดเนื้อหาในคุณสมบัติยืดหยุ่นของภาชนะไม่ใช้ทุกเพลาพื้นที่ข้ามใช้ได้

เคล็ดลับ: ใช้การจัดตำแหน่งแอตทริบิวต์ปรับเนื้อหา (ระดับ) บนแกนหมุน

หมายเหตุ: คุณต้องหลายรายการโฆษณาภายในภาชนะที่แห่งนี้เพื่อที่จะทำให้ผลที่ออกมา

เริ่มต้น:	ยืด
มรดก:	ไม่
สามารถเคลื่อนไหว:	NO โปรดดู การเคลื่อนไหว (Animatable)
เวอร์ชัน:	CSS3
ไวยากรณ์ javascript:	วัตถุ .style.alignContent = "center"ที่จะลอง

CSS ไวยากรณ์

ผิดนัด

值	描述	测试
stretch	默认值。项目被拉伸以适应容器。	测试 »
center	项目位于容器的中心。	测试 »
flex-start	项目位于容器的开头。	测试 »
flex-end	项目位于容器的结尾。	测试 »
space-between	项目位于各行之间留有空白的容器内。	测试 »
space-around	项目位于各行之前、之间、之后都留有空白的容器内。	测试 »
initial	设置该属性为它的默认值。请参阅 initial 。	测试 »
inherit	从父元素继承该属性。请参阅 inherit 。