做手机项目中遇到想让select居中的问题,原以为是无解的。
看Jquerymobile的时候发现它的select可以居中,于是如下:
<!DOCTYPE html> <html> <head> <title></title> <style> .ui-select { text-align: center; /* 加border只是为了看到边框*/ border:solid 1px; } .ui-select select { position: absolute; left: 0px; top: 0px; width: 100%; height: 3em; opacity: 0; } </style> </head> <body> <div class="ui-select"> <span>The 1st Option</span> <select> <option value="1">The 1st Option</option> <option value="2">The 2nd Option</option> <option value="3">The 3rd Option</option> <option value="4">The 4th Option</option> </select> </div> </body> </html>
基本实现思路就是隐藏掉select,实际点击到的是span。
代码写的很神奇是不是?
相关推荐
主要介绍了在IE8 FF中设置select控件文字垂直居中的方法,使用到了padding:8px 0,需要的朋友可以参考下
表单页面,为了使表单元素和文字都垂直居中对齐,加个样式input,select{vertical-align:middle},文本框和下拉框都没问题,但是单选框和复选框就杯具了。 大多表现:单选,复选和文字无间距,单选文字偏上,复选偏上...
让select透明,上面加一个span,来替换select框,可以自定义小三角样式,也可以做出select文字居中的效果。 <div class=ui-select> 使用加息券或现金券 <i class=icon-down></i> <select name= id=> 元...
1、支持字体、段落、大小、粗体、斜体下划线、上下标、左右与居中对齐等基本文本格式排版;2、数字、项目编号,减少、增加缩进量自如仿word快速排版模式;3、支持查找、替换,撤消、重做等基本编辑操作;4、提供插入...
1、支持字体、段落、大小、粗体、斜体下划线、上下标、左右与居中对齐等基本文本格式排版; 2、数字、项目编号,减少、增加缩进量自如仿word快速排版模式; 3、支持查找、替换,撤消、重做等基本编辑操作; 4、提供...
语义化标签:段落标签,标签自定义文字样式,标题标签,块,标签定义头部,标签定义底部,标签定义正文区段,标签定义侧边栏区域; 效果标签: 标签实现换行效果,特殊字符 实现空格效果,标签实现水平线...
12.9 打开的窗口居中 12.10 打开窗口的等待提示 12.11 在打开的窗口中返回数据 12.12 创建弹出窗口 12.13 不允许窗口出现滚动条 12.14 页面打开的同时打开另外两个窗口 12.15 慢慢变大的窗口 12.16 设置新打开的窗口...
12.9 打开的窗口居中 12.10 打开窗口的等待提示 12.11 在打开的窗口中返回数据 12.12 创建弹出窗口 12.13 不允许窗口出现滚动条 12.14 页面打开的同时打开另外两个窗口 12.15 慢慢变大的窗口 12.16 设置新打开的窗口...
1、支持字体、段落、大小、粗体、斜体下划线、上下标、左右与居中对齐等基本文本格式排版; 2、数字、项目编号,减少、增加缩进量自如仿word快速排版模式; 3、支持查找、替换,撤消、重做等基本编辑操作; 4、...
kindle高清文字版,可在电脑上用clearview电子书阅读软件阅读。 第1章 从网站重构说起 1.1 糟糕的页面实现,头疼的维护工作 1.2 Web标准——结构、样式和行为的分离 1.3 前端的现状 1.4 打造高品质的前端代码,...
1.jquery+css美化select下拉菜单插件(Stylish Select v0.3)下载 2.jQuery+CSS实现多项选择文本框的插件下载 3.jQuery表单验证插件EasyValidator 2.0带TIP提示效果 4.jQuery导航插件下载之支持三级的Menu暖色...
新增highlight_selected选项,用于让下拉菜单上的选中项目永远有高亮效果,并且与鼠标悬停时的效果进行区分。数据表格2:修复在height设置为page时鼠标无法滚动的问题。表单:优化了<select>在macOS系统上强制...
增加一根水平线,size为5px,宽度为50%,居中对齐,颜色为红色(red) 7、预格式化 作用:保留源文档中的回车 和 空格 的作用 <pre></pre> 8、分区元素 1、块分区元素 语法:<div></div> 作用:布局 2、行内...
让你短时间内由一名菜鸟到高手绝对没问题! 由于权限有限,分3部份下载 PHP程序开发范例宝典 内容提要 《PHP程序开发范例宝典》全面介绍了应用PHP进行网站开发的各种技术和技巧。《PHP程序开发范例宝典》分为20章...
01024改变Excel的标题文字 01025删除Excel的标题文字 01026将Excel设置为全屏显示 01027在状态栏中显示信息 01028显示、隐藏状态栏 01029显示、隐藏编辑栏 01030显示、隐藏常用工具栏 01031显示、隐藏格式工具栏 ...
实例198 页面布局(3列左右侧固定中间自适应居中) 244 实例199 页面布局(2列右侧固定左侧自适应宽度) 247 实例200 页面布局(2列左固定右自适宽度+底平齐) 249 实例201 页面布局(2列右固定左自适宽度+底平齐) 252 3.6 ...
ENTER键可以让光标移到下一个输入框 (event.keyCode==13)event.keyCode=9"> 文本框的默认值 (this.defaultValue)"> title换行 obj.title = "123
sdfs " 获得时间所代表的微秒 var n1 = new Date("2004-...
实例198 页面布局(3列左右侧固定中间自适应居中) 244 实例199 页面布局(2列右侧固定左侧自适应宽度) 247 实例200 页面布局(2列左固定右自适宽度+底平齐) 249 实例201 页面布局(2列右固定左自适宽度+底平齐) 252 3.6 ...