select让文字居中

刘津宇教编程

于 2014-08-22 11:10:25 发布

阅读量1.5w

点赞数

分类专栏： css知识点

css知识点专栏收录该内容

3 篇文章 0 订阅

订阅专栏

做手机项目中遇到想让select居中的问题，原以为是无解的。

看Jquerymobile的时候发现它的select可以居中，于是如下：

    Html代码   
    
  
 <!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。

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

刘津宇教编程

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
2
评论
select让文字居中

做手机项目中遇到想让select居中的问题，原以为是无解的。看Jquerymobile的时候发现它的select可以居中，于是如下： Html代码 > html> head> title>title> style> .ui-select { text-align: center; /*
复制链接

扫一扫