html - 使闪烁光标的位置居中而不改变占位符的位置

标签 html css cursor placeholder

我正在研究 website其中我想将闪烁光标的位置居中,占位符也居中。

此时在占位符 what are you looking for... 上,闪烁的光标从左边一直开始,如下所示。

enter image description here



我用于占位符和闪烁光标的 CSS 代码是:

闪烁光标:

.input-searchicon input{
padding-left: 40px;
}

占位符:

::-webkit-input-placeholder {
 text-align: center;


}

:-moz-placeholder { /* Firefox 18- */
 text-align: center;  


}

::-moz-placeholder {  /* Firefox 19+ */
 text-align: center;


}

:-ms-input-placeholder {  
 text-align: center; 


}


问题陈述:

我想知道我应该对上面的 CSS 代码进行哪些更改,以便闪烁的光标从中心开始,占位符也居中。

最佳答案

输入的文本也应该居中。将输入样式更改为:

.input-searchicon input{
   padding-left: 40px;
   text-align: center;
 }

关于html - 使闪烁光标的位置居中而不改变占位符的位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51507300/

相关文章:

javascript - HTML:一种防止在谷歌浏览器左下角显示 href 的方法

html - 相对于 div 的动态搜索栏

postgresql - 为重复的 SPI 调用重置顺序扫描位置

html - 如何在 rails 中的 text_area_tag 中插入占位符文本?

jquery - 我可以在 jquery 和 css 中将图像 slider 更改为文本 slider 吗

css - 如何从 HTML 表格中删除特定单元格?

javascript - 是否可以在单个 CSS 转换中结合使用 translateX/translateY 和 scale?

jquery - 使用 jQuery 和绝对定位的 div 用于下拉菜单。当光标仍在 div 上时停止隐藏菜单

css - HDPI 屏幕上的自定义光标是否有跨浏览器解决方案

html - CSS - 如何让文本从 div 的两端溢出?