html – text-align:选择[复制]中的中心占位符文本
发布时间:2020-12-14 16:45:09 所属栏目:资源 来源:网络整理
导读:参见英文答案 Is it possible to center text in select box?18个 我有一个下拉列表,其中包含占位符文本.在其他浏览器中,我能够将此占位符文本居中,但在Chrome中,text-align:center 以下是Select的HTML: .bookingform::-webkit-input-placeholder { /* Web
参见英文答案 >
Is it possible to center text in select box?18个
我有一个下拉列表,其中包含占位符文本.在其他浏览器中,我能够将此占位符文本居中,但在Chrome中,text-align:center 以下是Select的HTML: .bookingform::-webkit-input-placeholder { /* WebKit,Blink,Edge */ color: #FFF; font-size: 18px; font-family: "Raleway"; text-align: center; } .bookingform:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #FFF; opacity: 1; font-size: 18px; font-family: "Raleway"; text-align: center; } .bookingform::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #FFF; font-size: 18px; font-family: "Raleway"; opacity: 1; text-align: center; } .bookingform:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #FFF; font-size: 18px; font-family: "Raleway"; text-align: center; } .bookingform:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */ color: #FFF; font-size: 18px; font-family: "Raleway"; text-align: center; } <select name="number-of-adults" class="wpcf7-form-control wpcf7-select" aria-invalid="false"> <option value="ADULTS*">ADULTS*</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> </select> 那么我有什么遗失的东西吗?我的所有其他文本输入都将其占位符与中心对齐,下拉框与其他浏览器(如Firefox)上的中心对齐. 解决方法
this你想做什么?
select { text-align: center; text-align-last: center; /* webkit*/ } option { text-align: left; /* reset to left*/ } <select name="number-of-adults" class="wpcf7-form-control wpcf7-select" aria-invalid="false"> <option value="ADULTS*">ADULTS*</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> </select> <select name="number-of-adults" class="wpcf7-form-control wpcf7-select" aria-invalid="false"> <option value="ADULTS*">ADULTS*</option> <option value="1" selected="true">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> </select> 浏览器部分支持这一点(问题,至少在Edge和Safari中) (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |