CSS+jQuery表单美化方案

文本框的基础样式加点 CSS 就能焕然一新，配合 jQuery 还能玩点花样，像动画提示、动态验证啥的，体验感直接拉满。你要是想让页面的输入框和选择框不那么“原始”，这套 CSS+JQuery 的组合美化方案还挺值得一试的。样式不复杂，代码也不多，用起来挺顺手的。还有一些现成插件，像 select2、Chosen 这种，用起来省事不少。

美化input[type="text"]，基本就是边框、内边距、阴影和字体这些常规操作。再加上border-radius搞个圆角，界面立马精致不少。想玩点细节？:hover、:focus这种伪类别忘了，交互感靠它们撑起来。

jQuery 这块，主要是加点交互和动态效果，比如输入时提示、表单验证、窗口自适应这些。再高级点，可以搞自定义下拉框，模拟搜索、多选，全靠插件。选框的高级玩法你可以看看 jQselectable 插件，效果还蛮惊艳的。

推荐你动手扒一下texiao7189_1560681027这个压缩包里的例子，里面的 HTML、CSS、JS 一套配好，看一眼就能上手。尤其是初学者，照着改都能跑。

如果你还在头疼怎么让表单不那么“寡淡”，可以参考这些实用链接：

• css 文本框与按钮美化效果代码
• input 模拟 select 框美化特效
• jQuery 文本框自动提示

如果你想把表单搞得更顺眼，也更好用，建议 CSS+JQuery 一起上，既美观又灵活。