iT邦幫忙

2024 iThome 鐵人賽

DAY 17
0

<text-align>主要用於文字水平對齊,常見的值有以下幾種:

text-align: left;
text-align: right;
text-align: center;
text-align: justify;
text-align: start;
text-align: end;

text-align: left; :向左對齊文字
https://ithelp.ithome.com.tw/upload/images/20240923/20168468RLwzPnSpMJ.png

text-align: right;:向右對齊文字
https://ithelp.ithome.com.tw/upload/images/20240924/20168468XDW6Ue4vlV.png

text-align: center;:置中對齊文字
https://ithelp.ithome.com.tw/upload/images/20240924/20168468NOe5Bfuf5J.png

text-align: justify;:文字會均勻分佈,並且使每一行的左右兩端對齊
https://ithelp.ithome.com.tw/upload/images/20240924/20168468XeFqAXn4s2.png

text-align: start;:向起始位置對齊
https://ithelp.ithome.com.tw/upload/images/20240924/2018468gV60OFL8u0.png

text-align: end;:向結束位置對齊,假設是從左到右的文字,會向右對齊
https://ithelp.ithome.com.tw/upload/images/20240924/20168468mrSPSk2Wz7.png

可透過<text-align: justify> <text-align: start>看出justify的文字比較寬鬆,
每個字之間都有間隔,並且均勻分佈在段落中;而start則是統一靠起始位置對齊,並沒有均勻分佈。
所以可能使用justify整體看起來會更整齊更好看,那text-align就先介紹到這邊啦~~~
/images/emoticon/emoticon10.gif


上一篇
Day16.CSS<justify-content>屬性
下一篇
Day18.CSS<align-items>屬性
系列文
Web前端的探索:30天的驚奇之旅30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言