這是我在寫登陸框時(shí)發(fā)現(xiàn)的問題舟铜，我發(fā)現(xiàn)輸入框的上邊框好像消失了一樣
image
然后經(jīng)過在網(wǎng)上的查找，終于找到了原因
原因是因?yàn)樽儞Q：translate（-50％赚哗， - 50％）;壹若，這好像是windows chrome的一個(gè)bug
在我把這句話去除之后就發(fā)現(xiàn)輸入框恢復(fù)了正常的樣子，但是去掉這句話之后原先的定位居中就會(huì)消失了
那么我們?nèi)绾卧诓粍h除translate（-50％扭勉， - 50％）的情況下鹊奖，讓輸入框的上邊框出現(xiàn)呢？
我們可以為輸入框添加一個(gè)上邊框
.input input[type=text]{
width:100%;
padding: 10px 10px 10px 23px;
outline:none;
border: 1px solid #aaa;
}
還可以使用transform: transform: translate(-50%, -50%) perspective(1px);來讓邊框出現(xiàn)
或者在父元素上面添加
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
參考自：https://stackoverflow.com/questions/42151075/input-top-border-disappears-in-windows-chrome
