ขนาดตัวอักษรของเหลว 16px ถึง 24px
คำนวณค่าแคลมป์ CSS ของเหลวจริงจากขนาดขั้นต่ำและขนาดสูงสุดบนความกว้างวิวพอร์ตสองรายการ โดยจะแสดงความชันและจุดตัดกันทีละขั้นตอน พร้อมแสดงตัวอย่างการปรับขนาดแบบเรียลไทม์
ผลลัพธ์
การปรับขนาดตัวอักษรอย่างลื่นไหลจาก 16px เป็น 24px เป็นหนึ่งในคำถามที่พบบ่อยที่สุดในการค้นหา CSS clamp() เนื่องจาก 16px เป็นค่าเริ่มต้นของเนื้อหาข้อความที่ใกล้เคียงสากล และ 24px เป็นขั้นตอนที่พบบ่อยสำหรับส่วนหัวหรือย่อหน้านำที่ใหญ่ขึ้นเล็กน้อย หน้านี้จะเปิดเครื่องคิดเลขโดยคู่นั้นได้กรอกข้อมูลไว้ล่วงหน้าแล้วโดยเทียบกับช่วงวิวพอร์ต 320px ถึง 1280px ดังนั้นเส้น Clamp() จึงพร้อมทันทีที่โหลด
หากคุณต้องการเพียง rem แบบคงที่หรือ em ที่เทียบเท่ากับ 16px หรือ 24px — โดยไม่มีการปรับขนาดตามวิวพอร์ต — ตัวแปลง px เป็น rem จะตอบคำถามนั้นในขั้นตอนเดียว เครื่องคิดเลขนี้ใช้สำหรับกรณีที่ค่าควรเปลี่ยนอย่างราบรื่นเมื่อหน้าต่างเบราว์เซอร์ปรับขนาด แทนที่จะคงที่ไว้ที่ค่า rem หนึ่งค่า
รายละเอียดด้านล่างแสดงให้เห็นว่า 16px และ 24px กลายเป็นทางลาด ค่าสัมประสิทธิ์ vw และจุดตัดของแกน y ได้อย่างไร และแถบเลื่อนแสดงตัวอย่างแบบสดช่วยให้คุณลากผ่านช่วง 320–1280px เพื่อดูข้อความที่ขยายจากขนาดหนึ่งไปยังอีกขนาดหนึ่งแบบเรียลไทม์ ก่อนที่คุณจะคัดลอกบรรทัด CSS ลงในสไตล์ชีตของคุณ