โค้ดแล็บนี้จะช่วยให้คุณแชร์และแสดงวิธีจัดกึ่งกลางใน CSS ที่คุณชื่นชอบได้
อ่านบล็อกโพสต์การจัดกึ่งกลางใน CSS เพื่อดู 5 วิธีการจัดกึ่งกลางใน CSS ที่เราชอบ หรือดูวิดีโอนี้
ตั้งค่า
- คลิกรีมิกซ์เพื่อแก้ไขเพื่อให้โปรเจ็กต์แก้ไขได้
- เปิด
app/index.html
- ที่
line 23
ให้แทนที่/* your centering CSS here /*
ด้วย CSS ของคุณ - (ไม่บังคับ) ตั้งชื่อเทคนิคการจัดกึ่งกลาง แล้วแทนที่ข้อความใน
<h1>
รูปแบบ
- สร้างไฟล์ใหม่ในโฟลเดอร์
app/css/
- สร้างตัวเลือกเพื่อเก็บโซลูชันการจัดกึ่งกลาง เช่น
.turbo-center
หรือ[floaty-mcfloat]
- เขียนเทคนิคการจัดกึ่งกลางภายในตัวเลือกใหม่นั้น (ดูตัวอย่างของคนอื่นใน
app/css/
ได้) - (ไม่บังคับ) เขียน "รูปแบบที่รองรับ" เพื่อให้เราทราบว่าเด็กๆ ต้องการรูปแบบใดบ้างเพื่อรองรับการจัดกึ่งกลาง
- เปิด
app/css/index.css
และนำเข้าไฟล์ใหม่ด้านล่าง
สรุป
- เปิด
app/index.html
อีกครั้ง - ค้นหา
<article>
แล้วตั้งค่าตัวเลือกที่กำหนดเองที่คุณสร้างไว้ในขั้นตอนที่ 2 ของส่วนก่อนหน้า - ทวีตภาพข้อบกพร่องมาให้เรา แล้วเราจะแสดงภาพนั้นในบล็อกโพสต์