WeChat小程序交流(QQ群:769977169)
text组件中明明设置了text-align的对齐方式为center,但却没有效果。
后来经过检查发现,因为text组件是在view中的行内组件,且text组件中的字符是不定长度的,所以无法处理text-align的center对齐方式,只需要设置块内view中的对齐方式就可以解决居中对齐问题。
处理前样式代码
.topUIStyle{
width: 20%;
height: 100%;
position: relative;
}
.topUIStyle .titleStyle{
width: 100%;
height: 50px;
line-height: 50px;
font-size: 14px;
color: gray;
text-align: center;
}
.topUIStyle .titleSelectedStyle{
width: 100%;
height: 50px;
line-height: 50px;
font-size: 16px;
color: red;
text-align: center;
}
处理后样式代码
.topUIStyle{
width: 20%;
height: 100%;
text-align: center;
position: relative;
}
.topUIStyle .titleStyle{
width: 100%;
height: 50px;
line-height: 50px;
font-size: 14px;
color: gray;
}
.topUIStyle .titleSelectedStyle{
width: 100%;
height: 50px;
line-height: 50px;
font-size: 16px;
color: red;
}