css三个文本框内的字体居中

CSS是Web页面设计不可或缺的一部分，对于文本框内的字体居中对于页面的美观至关重要。下面分享一些有关如何在CSS中对于文本框内的字体居中的方法。

input[type="text"],
input[type="password"],
textarea {
    text-align: center;
} 

上述方法是最简单的一种方式，利用text-align属性调整文本框内的字体居中。

input[type="text"],
input[type="password"],
textarea {
    display: flex;
    justify-content: center;
    align-items: center;
} 

另外一种方法是采用flexbox布局，display:flex可以让容器内的元素成为一个flex容器，justify-content:center可以让内部所有元素水平居中对齐，align-items:center可以让内部所有元素垂直居中对齐。

input[type="text"],
input[type="password"],
textarea {
    display: table-cell;
    vertical-align: middle;
} 

最后一种方法是利用table属性，display:table-cell可以让元素变成表格单元格，vertical-align可以让单元格中的内容在垂直方向上居中。

以上三种方法都可以实现文本框内的字体居中，其中flexbox布局需要注意兼容性，在IE10以下不支持。此外，table属性也会对性能产生一定的影响，建议根据不同情况选择使用。