• อัปโหลด

เมื่อก่อนต้องเขียน JavaScript ตอนนี้ใช้ CSS บรรทัดเดียว|6 ฟีเจอร์ใหม่ Baseline ในปี 2026|กวดวิชา CSS

4595
4
2026-10-14 13:09:08
217
65
268
17
กล่องข้อความจะขยายสูงขึ้นโดยอัตโนมัติขณะพิมพ์, เปลี่ยนธีมสีแล้วสีข้อความจะเลือกดำหรือขาวให้อัตโนมัติ, รูปโปรไฟล์จัดเรียงเป็นรูปพัดโดยอัตโนมัติ, การ์ดทั้งใบสลับธีมกลางวันกลางคืนได้ด้วยตัวแปรภายนอกตัวเดียว เมื่อก่อนเอฟเฟกต์เหล่านี้หลายอย่างต้องเขียน JavaScript หรือเขียน CSS ซ้ำๆ กันมากมาย แต่ตอนนี้ใช้ CSS แค่ไม่กี่บรรทัดเท่านั้น ฟังก์ชันทั้งหกนี้กลายเป็น Baseline ในปี 2026 กล่าวคือ Chrome, Edge, Firefox และ Safari รองรับทั้งหมดแล้ว สามารถนำไปใช้บนเว็บไซต์จริงได้อย่างมั่นใจ ในวิดีโอนี้เราจะใช้การ์ดคำเชิญปาร์ตี้ 1 บทต่อ 1 ฟังก์ชัน มาดูวิธีทำแบบเดิมก่อน แล้วค่อยเขียนวิธีทำของปี 2026 ให้ดูกันสดๆ รวมถึงข้อผิดพลาดที่มักเกิดขึ้นจริง สิ่งที่คุณจะได้เรียนรู้: ・field-sizing: content: ทำให้ textarea สูงขึ้นตามเนื้อหา และเหตุผลที่ต้องใส่ min-height: 3lh ・contrast-color(): เลือกตัวหนังสือสีดำหรือสีขาวให้อัตโนมัติTตามสีพื้นหลัง ・clip-path: shape(): วาดคลื่นด้วยเปอร์เซ็นต์ ยืดหดไปพร้อมกับอีเลเมนต์ (path() ใช้ได้แค่พิกเซลเท่านั้น) ・sibling-index() และ sibling-count(): รู้ว่าตัวเองอยู่อันดับที่เท่าไหร่ มีทั้งหมดกี่อัน และจัดเรียงเป็นรูปพัดโดยอัตโนมัติ ・container style queries: @container style(--tone: night) และเหตุผลที่ต้องวางตัวแปรไว้ที่เลเยอร์ชั้นบน ・:open: เลือก elements ประเภท details, dialog, select ที่ถูกกางออกโดยตรง
热爱Web技术,教学相长。我是Steven,一起加油!
บริการลูกค้า
ด้านบน
赛事库 课堂 2021拜年纪