CSS Knowledge เป็น บอร์ดรวามความรู้ CCC เน้นบทความ แนวทางการเขียนโปรแกรม บันทึกกันลืม เพื่อให้สมาชิกได้เขียนความรู้ที่ตัวเองมีให้สมาชิกท่านอื่นๆ ได้ เข้ามาอ่าน และ ไว้อ่านเองกันลืมด้วย
Moderator: mindphp, ผู้ดูแลกระดาน
-
Patipat
- PHP Super Hero Member
- โพสต์: 996
- ลงทะเบียนเมื่อ: 10/06/2019 10:12 am
โพสต์ที่ยังไม่ได้อ่าน
โดย Patipat »
ถ้าเรามีข้อความหรือ รูปและต้องการกำหนดให้มีขนาดกรอบตามขนาดที่เราต้องการ โดยไม่ต้องตัดข้อความออก เรามีวิธีที่ใช้
CSS คือ
scrollbarการสร้างแถบ Scrollbar ก็คือสร้างไว้ เพื่อกำหนดระยะกรอบได้ อย่างเช่น เรามีภาพ เรียงต่อกันยาวๆ จำนวณ 20 รูป แต่ว่าเราจะทำ scrollbar เพื่อแสดงแค่ 3 รูปและรูปที่เหลือเราสามารถเลื่อนดูได้นั่นเองครับ เรามาดูวิธีการใช้งานกันเลย
ตัวอย่างโค้ดนะครับ
โค้ด: เลือกทั้งหมด
style="overflow: scroll;
width: 130px;
height: 342px;
">
ผลลัพธ์ก็คือ
เราจะได้ scrollbar มา 1 อันนะครับ
ถ้าเราใช้งานแล้ว ถ้ารูปภาพไม่มี มันจะขึ้นแบบนี้ครับ เป็นว่างเปล่า โดยเราจะทำให้รูปภาพที่ไม่มี ไม่ขึ้น scrollbar ครับ
- Selection_999(1036).png (49.89 KiB) Viewed 889 times
ให้เราใส่ โค้ดคำว่า
overflow: overlay; ลงไปครับ
โค้ด: เลือกทั้งหมด
style="overflow: scroll;
width: 130px;
height: 342px;
overflow: overlay;
">
ผลลัพธ์ทีเราได้ก็คือ ไม่มีรูป scrollbar แล้วนะครับแต่ถ้ามีรูป ก็จะขึ้น scrollbar ให้ครับ
- Selection_999(1037).png (48.54 KiB) Viewed 889 times
Kor ma di kub.
สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 60