1 appearance:none;

2 -moz-appearance:none; /* Firefox */

3 -webkit-appearance:none; /* Safari 和 Chrome */

例子:使用appearance属性改变元素的外观

1 <p class="lookLikeAButton">我是一个段落P元素 </p>

2 <p class="lookLikeAListbox">我是一个段落P元素 </p>

3 <p class="lookLikeAListitem">我是一个段落P元素 </p>

4 <p class="lookLikeASearchfield">我是一个段落P元素 </p>

5 <p class="lookLikeATextarea">我是一个段落P元素 </p>

6 <p class="lookLikeAMenulist">我是一个段落P元素</p>

1 /*看起来像个按钮,以按钮的风格渲染*/

2 .lookLikeAButton{

3      -webkit-appearance:button;

4      -moz-appearance:button;

5 }

6 /*看起来像个清单盒子,以listbox风格渲染*/

7 .lookLikeAListbox{

8      -webkit-appearance:listbox;

9      -moz-appearance:listbox;

10 }

11 /*看起来像个清单列表,以listitem风格渲染*/

12 .lookLikeAListitem{

13      -webkit-appearance:listitem;

14      -moz-appearance:listitem;

15 }

16 /*看起来像个搜索框,以searchfield风格渲染*/

17 .lookLikeASearchfield{

18      -webkit-appearance:searchfield;

19      -moz-appearance:searchfield;

20 }

21 /*看起来像个文本域,以textarea风格渲染*/

22 .lookLikeATextarea{

23      -webkit-appearance:textarea;

24      -moz-appearance:textarea;

25 }

26 /*看起来像个下接菜单,以menulist风格渲染*/

27 .lookLikeAMenulist{

28      -webkit-appearance:menulist;

29      -moz-appearance:menulist;

30 }

/*去除单选或多选边框边框 css样式*/

.seclectnoBoreder{

-webkit-appearance:searchfield;

-moz-appearance:searchfield;

}

如果为百度,360等 即可用以下css样式去解决

.touming{

background:transparent;

border-top:none;

border-bottom: none;

border-left: none;

border-right: none

}

(webapp)微信和safri 对于html5 部分功能不兼容,多选或单选下拉框去除边框无效果。的更多相关文章

  1. JQuery实现的 checkbox 全选;<select>下拉框功能

    1. 全选的checkbox选中时,子checkbox全部选中.反之,全部不选 2.子checkbox中,只要有没有被选中的,取消全选checkbox的选中 3.子checkbox的数量和子check ...

  2. 自定义SWT控件三之搜索功能下拉框

    3.搜索功能下拉弹出框 package com.view.control.select; import java.util.ArrayList; import java.util.LinkedList ...

  3. struts-hibernate-ajax完成区县和街道级联下拉框功能(二补充使用json解析list结果集,ajax循环json层级处理)

    针对<struts-hibernate-ajax完成区县和街道级联下拉框功能>进行补充,上一篇中,要在action中拼接JSON格式字符串,很容易手抖.直接用json处理一下转成json格 ...

  4. 微信内置浏览器中,点击下拉框出现页面乱跳转现象(iphone)

    微信内置浏览器中,点击下拉框出现页面乱跳转现象(iphone) 前言: 这是小菜博客的第三篇文章.一直认为自己可以表达的东西太过简单,难以上台面,总是吝啬地不肯写.就算是写,也不知道从何开始.在同事的 ...

  5. 【经验】angularjs 实现带查找筛选功能的select下拉框

    一.背景 对于select的下拉列表,像国家选择这样的功能,全世界那么多国家,一直拉滚动条多辛苦,眼睛也要盯着找,累!so,为优化用户体验,带查找功能的下拉框是非常非常有必要的.都知道jquery里有 ...

  6. JS为Select下拉框添加输入功能

    JavaScript使用parentNode.nextSibling.value实现的本功能,实际上你会发现网页上有两个控件元素,一个是Select,一个是input,使用CSS将input覆盖于se ...

  7. 微信小程序下拉框

    微信小程序里没有和HTML里的下拉框一样的组件,想要相同的效果只能自己写一个,先看效果 下面来看一下代码: 首先WXML <view class='select_box'> <vie ...

  8. 原生javascript实现 下拉框搜索功能

    由于业务需求,要实现 一个下拉框搜索功能.这个下拉功能和百度的还是有点区别的,百度的是时时与服务器交互的,而这个只是模拟.技术点在于实现 了搜索功能. 未搜索前如下图: 搜索后: <!DOCTY ...

  9. C# ,数据导出到带有级联下拉框的模板(一,模板的级联功能)

    一.首先解决如何做模板中增加级联功能 1,首先打开一个新的Excel文件,新增sheet,把分类保存在里面,如下图所示 2.回到sheet1,选中要增加下拉框的行(注意:请排除首行,首行是标题) 3. ...

随机推荐

  1. 铁乐学python_day18-19_面向对象编程1

    以下笔记绝大部分(百分之80或以上)摘自我的授课老师之一:老男孩教育中的景老师. 她上课讲的知识点由浅入深,引人入胜,听她的课完全不会感觉到困阿,而且不知不觉中就感觉掌握了. 她的博客是: http: ...

  2. win10WLAN没有有效的ip配置

    方案一:将路由器和猫重启一下,一般都可以解决了!方案二:1.在开始菜单上单击鼠标右键,选择“命令提示符(管理员)”,如果没有找到这个选项,通过cortana搜索cmd,右键以管理员身份运行,还可以进入 ...

  3. MySql报2006error错误的解决方法(数据过大)

    最近迁移项目中发现,转移数据库出现的几个问题,其中之一就是 2006 error,解决过程如下: 首先贴出报错结果 [Msg] Finished - Unsuccessfully 出现这个结果,首先检 ...

  4. C++浅拷贝和深拷贝的区别

    C++浅拷贝和深拷贝的区别 2012-04-24 21:22 11454人阅读 评论(6) 收藏 举报 c++deleteclass编译器c c++默认的拷贝构造函数是浅拷贝 浅拷贝就是对象的数据成员 ...

  5. multi_index_container

    转自:https://blog.csdn.net/buptman1/article/details/38657807 multi_index_container: Boost Multi-index ...

  6. 获取URL网页信息

    static string GetHtml(string url) {string strHTML = ""; WebClient myWebClient = new WebCli ...

  7. 前端统计利器:Sentry & Matomo

    今天主要说下两款前端统计工具的使用,Sentry & Matomo.以下主要是统计代码接入方式,因此使用前提是你已经在自己的服务器上搭建好了Sentry和Matomo的服务器 Sentry统计 ...

  8. 来自苹果的编程语言——Swift简单介绍【整理】

    2014年06月03日凌晨,Apple刚刚公布了Swift编程语言,本文从其公布的书籍<The Swift Programming Language>中摘录和提取而成.希望对各位的iOS& ...

  9. Kubernetes 初探

    一.容器: 1. 容器是运行一个或一组进程的方法,使得这些进程和主机上其他进程相隔离 2. 容器类似于虚拟机,但不同于虚拟机 容器                                    ...

  10. 新浪微博资深大牛全方位剖析 iOS 高级面试

    第1章 课程简介本章对这门课程所讲述内容进行概要介绍,其中包括课程目标.适合人群,课程特色.课程收获.课程安排等.整个课程学习完结后,有机会获得电话模拟面试及内推. 1-1 课前必读(不看会错过一个亿 ...