การจัดวางข้อความไม่ให้ล้นออกนอกรอบ ทำได้โดยใส่โค๊ด word-wrap:break-word;
ตัวอย่างเช่น
<html>
<head>
<style>
p.test
{width:120px;
border:5px solid red;
word-wrap:break-word;}
</style>
</head>
<body>
<p> ข้อความนี้ยาวเกินไป ยาววววววมว๊ากๆๆๆๆๆๆๆๆๆๆๆๆเวอร์รรรรรรรรรรรรรรรรรจริง จริงๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆ CSS3 word wrap จะช่วยจัดข้อความไม่ให้ล้นออกนอกกรอบ</p>
</body>
</html>ผลลัพธ์คือ

*** หากไม่ใส่โค๊ด word-wrap:break-word; ตามตัวอย่างข้างบนข้อความจะล้นออกนอกกรอบ เช่นรูปด้านล่าง***

0 ความคิดเห็น:
แสดงความคิดเห็น