方法一：利用letter-spacing屬性和em

html

熱門搜索電視機性感漂亮高跟鞋手機對齊牛仔褲小家碧玉家居

css

.hotsearch dd{

float: left;

line-height: 24px;

margin-right: 30px;

overflow: hidden;

text-align: center;

width: 4em; /*這個值是看最長能顯示幾個文字，如x，則為x em*/

}

.hotsearch dd a{

display:block;

}

.w2{

letter-spacing:2em; /*如果需要y個字兩端對齊，則為(x-y)/(y-1),這里是(4-2)/(2-1)=2em */

margin-right:-2em; /*同上*/

}

.w3{

letter-spacing:0.5em; /*如果需要y個字兩端對齊，則為(x-y)/(y-1),這里是(4-3)/(3-1)=0.5em */

margin-right:-0.5em; /*同上*/

}

}

方法二：利用透明字占位

空格

方法三：利用兩端對齊屬性

text-align:justify;

width:100px;

方法四：利用占位符

? ?一個空格的位置

? ?一個字符的位置

? ?半個字符的位置

此處需要注意的是在微信小程序中使用占位符只能在標簽對內使用，

總結

以上是生活随笔為你收集整理的html 不同字数对齐,表单短标题不同字数两端对齐问题的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。