Doan van bi tran ra khoi khu vuc chua: gia tri clip Tra loi bao chi hoi dau thang, Pho chu tich thuong truc VFF Tran Quoc Tuan va HLV Nguyen Huu Thang tung de cap toi kha nang mo cua cho
Trang 1Tạo hiệu ứng cho Text trong CSS3
CSS3 bổ sung thêm một số tính năng giúp bạn tạo hiệu ứng cho text:
• text-overflow
• word-wrap
• word-break
Bảng dưới liệt kê một số thuộc tính thường được sử dụng trong CSS3:
Giá trị Miêu tả
text-align-last Căn chỉnh dòng văn bản cuối cùng
text-emphasis Được sử dụng để nhấn mạnh phần văn bản nào đó
text-overflow Được sử dụng để xác định xem cách để báo cho người dùng biết rằng có
phần nội dung bị tràn ra khỏi khối mà không được hiển thị
word-break Được sử dụng để ngắt dòng dựa vào từ
word-wrap Được sử dụng để ngắt dòng và bao vào trên dòng tiếp theo
Thuộc tính text-overflow trong CSS3
Thuộc tính text-overflow được sử dụng để xác định xem cách để báo cho người dùng biết
rằng có phần nội dung bị tràn ra khỏi khối mà không được hiển thị Dưới đây là ví dụ minh
họa cách sử dụng của thuộc tính text-overflow trong CSS3:
<html> <head> <style> p.text1 { white-space:
nowrap; width: 200px; border: 1px solid #000000; overflow: hidden; text-overflow: clip; } p.text2
{ white-space: nowrap; width: 200px;
border: 1px solid #000000; overflow: hidden; text
-overflow: ellipsis; } </style> </head> <body>
<b>Doan van ban dau:</b> <p>Tra loi bao chi hoi dau thang, Pho chu
tich thuong truc VFF Tran Quoc Tuan va HLV Nguyen Huu Thang tung de cap toi kha nang mo cua cho cau thu nhap tich len tuyen Theo ong Tran Quoc Tuan, nhung
cau thu nay neu dap ung duoc yeu cau ve chuyen mon do HLV Nguyen Huu
Trang 2Thang dat rat hi deu co kha nang len tuyen.</p> <b>Doan van bi
tran ra khoi khu vuc chua: gia tri clip</b> <p class="text1">Tra loi
bao chi hoi dau thang, Pho chu tich thuong truc VFF Tran Quoc Tuan va HLV
Nguyen Huu Thang tung de cap toi kha nang mo cua cho cau thu nhap tich
len tuyen Theo ong Tran Quoc Tuan, nhung cau thu nay neu dap ung duoc yeu cau
ve chuyen mon do HLV Nguyen Huu Thang dat rat hi deu co kha nang len tuyen.</p>
<b>Doan van bi tran ra khoi khu vuc chua: gia tri ellipsis</b> <p
class="text2">Tra loi bao chi hoi dau thang, Pho chu tich thuong truc VFF Tran
Quoc Tuan va HLV Nguyen Huu Thang tung de cap toi kha nang mo cua cho
cau thu nhap tich len tuyen Theo ong Tran Quoc Tuan, nhung cau thu nay neu dap
ung duoc yeu cau ve chuyen mon do HLV Nguyen Huu Thang dat rat hi deu co
kha nang len tuyen.</p> </body> </html>
Kết quả là:
Doan van ban dau:
Tra loi bao chi hoi dau thang, Pho chu tich thuong truc VFF Tran Quoc Tuan
va HLV Nguyen Huu Thang tung de cap toi kha nang mo cua cho cau thu nhap
tich len tuyen Theo ong Tran Quoc Tuan, nhung cau thu nay neu dap ung duoc
yeu cau ve chuyen mon do HLV Nguyen Huu Thang dat rat hi deu co kha nang
len tuyen
Doan van bi tran ra khoi khu vuc chua: gia tri clip
Tra loi bao chi hoi dau thang, Pho chu tich thuong truc VFF Tran Quoc Tuan
va HLV Nguyen Huu Thang tung de cap toi kha nang mo cua cho cau thu nhap
tich len tuyen Theo ong Tran Quoc Tuan, nhung cau thu nay neu dap ung duoc
yeu cau ve chuyen mon do HLV Nguyen Huu Thang dat rat hi deu co kha nang
len tuyen
Doan van bi tran ra khoi khu vuc chua: gia tri ellipsis
Tra loi bao chi hoi dau thang, Pho chu tich thuong truc VFF Tran Quoc Tuan
va
Thuộc tính word-break trong CSS3
Được sử dụng để ngắt dòng, ví dụ sau minh họa cách sử dụng thuộc tính word-break trong
CSS3:
<html> <head> <style> p.text1 { width: 140px; border: 1px solid #000000; word-break: keep-all; }
p text2 { width: 140px; border: 1px solid #000000;
Trang 3word-break: break-all; } </style> </head> <body>
<b>Vi du ve Line Break (ngat dong) tai dau gach noi (-)</b> <p
class="text1">Tra loi bao chi hoi dau thang, Pho chu tich thuong- truc VFF Tran
Quoc Tuan va HLV Nguyen Huu Thang tung de cap toi kha nang mo cua cho
cau thu nhap tich len tuyen Theo ong Tran Quoc Tuan, nhung cau thu nay neu dap
ung duoc yeu cau ve chuyen mon do HLV Nguyen Huu Thang dat rat hi deu co
kha nang len tuyen.</p> <b>Vi du Line Break tai bat ky ky tu
nao</b> <p class="text2">Tra loi bao chi hoi dau thang, Pho chu tich
thuong truc VFF Tran Quoc Tuan va HLV Nguyen Huu Thang tung de cap toi
kha nang mo cua cho cau thu nhap tich len tuyen Theo ong Tran Quoc Tuan, nhung
cau thu nay neu dap ung duoc yeu cau ve chuyen mon do HLV Nguyen Huu
Thang dat rat hi deu co kha nang len tuyen.</p> </body> </html>
Kết quả là:
Vi du ve Line Break (ngat dong) tai dau gach noi (-)
Tra loi bao chi hoi dau thang, Pho chu tich thuong- truc VFF Tran Quoc Tuan
va HLV Nguyen Huu Thang tung de cap toi kha nang mo cua cho cau thu nhap
tich len tuyen Theo ong Tran Quoc Tuan, nhung cau thu nay neu dap ung duoc
yeu cau ve chuyen mon do HLV Nguyen Huu Thang dat rat hi deu co kha nang
len tuyen
Vi du Line Break tai bat ky ky tu nao
Tra loi bao chi hoi dau thang, Pho chu tich thuong truc VFF Tran Quoc Tuan v
a HLV Nguyen Huu Thang tung de cap toi kha nang mo cua cho cau thu nhap t
ich len tuyen Theo ong Tran Quoc Tuan, nhung cau thu nay neu dap ung duoc
yeu cau ve chuyen mon do HLV Nguyen Huu Thang dat rat hi deu co kha nang
len tuyen
Thuộc tính word-wrap trong CSS3
Cú pháp sau minh họa cách sử dụng của thuộc tính word-wrap trong CSS3
p { word-wrap: break-word; }