将SELECT-OPTIONS文本向右对齐 [英] Align SELECT-OPTIONS text to right

问题描述

这些是我开发的表单的屏幕截图。

These are the screen shots of the form I am developing.

我想设计选择框中的选项框中的选项中的文本是正确的对齐方式，选择选项后，它选择的文本显示也应该如下图所示。

I want to design select box in form in such a way that text in options is right aligned and after selecting the option it selected text shown also should be displayed as shown in below image.

HTML代码：

<select>
    <option value="0" selected="selected" style="text-align: right;">EqualsTo</option>
    <option value="1">LessThan</option>
    <option value="2">GreaterThan</option>
    <option value="3">LessThanEqualsTo</option>
    <option value="4">GreaterThanEqualsTo</option>
    <option value="5">Between</option>
</select>

推荐答案

p>

I could do it just with CSS alone.

select {
    width: auto;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: 2px 2px 2px 2px;
    border: none;
    background: transparent url(../images/dropdown.png) no-repeat 161px center;
    background-position-x: 98%;
}

select::-ms-expand {
    display: none;
}

这是一个小调： http://jsfiddle.net/ajinkya34/nc548/

这篇关于将SELECT-OPTIONS文本向右对齐的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！