Ngôn ngữ CSS - CSS Word Wrap
Thuộc tính Word-Wrap
Thuộc tính word-wrap sẽ làm cho những từ dài xuống hàng mà không làm vỡ layout.
Cú pháp:
tagName{word-wrap:value}
Bảng danh sách giá trị của thuộc tính word-wrap:
Giá trị | Ví dụ | Mô tả |
---|---|---|
break-word | word-wrap: break-word; | Những từ quá dài sẽ xuống hàng. |
normal | word-wrap: normal; | Trả về dạng mặc định ban đầu cho word-wrap. |
Ví dụ: Sử dụng thuộc tính word-wrap:normal;
<html>
<head></head>
<style>
p {
border: 1px solid #cc0000;
width: 150px;
}
</style>
<body>
<p>Hiệp SIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIĨ IT</p>
</body>
</html>
Ví dụ : Sử dụng thuộc tính word-wrap:break-word;
<html>
<head></head>
<style>
p {
border: 1px solid #cc0000;
width: 150px;
word-wrap: break-word;
}
</style>
<body>
<p>Hiệp SIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIĨ IT</p>
</body>
</html>