我写了一个appbox的flexbox css样式,但是布局在Webkit上的中文模式有点奇怪。
突出显示的绿色背景色是flexbox格。
.green-background-color-div`
display: flex;
flex: 1;
flex-direction: row;
align-items: center;
background-color: green;
`;
文本是textField的占位符,即此textField的css。
.textField`
width: 100%;
height: 100%;
padding: 0;
margin: 0;
caret-color: gray;
font-size: 18px;
border: none;
outline: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background-color: transparent;
-webkit-appearance: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: transparent;
&::-webkit-search-cancel-button {
display: none;
}
`;
普通文本没有问题。
我应该如何调整代码以像在Chrome中那样居中显示中文?
答案 0 :(得分:1)
在CSS中使用行高
.textField{
line-height:26px;
}
26px是一个假设。您可以根据自己的设计进行增加。