HTML5、Select下拉框右边加图标的实现代码(增进用户体验)

<p id="login-p">

                <p class="select-wrapper">

                    <select id="selector1">

                        <option value="" disabled selected>请选择系统：</option>

                        <option value="1">微信-苹果</option>

                        <option value="2">微信-安卓</option>

                    </select>

                    <img src="ossweb-img/arrow.png" alt="" class="arrow" />

                </p>

                <p class="select-wrapper">

                    <select id="selector2">

                        <option value="" disabled selected>请选择渠道：</option>

                        <option value="1">渠道1</option>

                        <option value="2">渠道2</option>

                    </select>

                    <img src="ossweb-img/arrow.png" alt="" class="arrow" />

                </p>

                <p class="select-wrapper">

                    <select id="selector3">

                        <option value="" disabled selected>请选择大区：</option>

                        <option value="1">大区1</option>

                        <option value="2">大区2</option>

                    </select>

                    <img src="ossweb-img/arrow.png" alt="" class="arrow" />

                </p>

                <p class="select-wrapper">

                    <select id="selector4">

                        <option value="" disabled selected>请选择角色：</option>

                        <option value="1">角色1</option>

                        <option value="2">角色2</option>

                    </select>

                    <img src="ossweb-img/arrow.png" alt="" class="arrow" />

                </p>

                <p id="notice">单个帐号只能领取一次奖励</p>

                <img src="ossweb-img/comfire1.png" alt="" id="comfire1"/>

            </p>