input输入框placeholder居中问题

最新推荐文章于 2023-08-26 15:45:25 发布

一剑长歌

最新推荐文章于 2023-08-26 15:45:25 发布

阅读量3.1k

点赞数

分类专栏： CSS

本文链接：https://blog.csdn.net/weixin_41395548/article/details/121331969

版权

CSS line-height placeholder absolute定位输入框样式

关键词由CSDN通过智能技术生成

CSS 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

从百度上得到的最多的答案就是使用line-height，但是在项目中无论我怎么使用这个属性，placeholder还是纹丝不动，后来还是使用定位解决的，如果遇到同样问题的同学，可以参考一下：

#input{
  position: relative;
  caret-color: #333;
  box-sizing: border-box;
  font:600 .22rem/.3rem PingFangSC-Regular, PingFang SC;
  color: #333;
}
#input::-webkit-input-placeholder {
    position: absolute;
    top: .04rem; 
    /* top: 50% */
    /* transform:translateY(-50%); */
    font: 400 .16rem PingFangSC-Regular, PingFang SC;
    color: #999;
  }