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. eclipse 调试技巧收集

    1  eclipse启动tomcat无法访问 原因:部署路径没有选择 tomcat安装路径 解决:双击,设置server location即可 http://blog.csdn.net/wqjsir/ ...

  2. idea+maven+spring+cxf创建webservice应用(二)生成客户端程序

    idea+maven+spring+cxf创建webservice应用(二)生成客户端程序,以上一篇为基础"idea+maven+spring+cxf创建webservice应用" ...

  3. spark搭建部署

    基础环境准备 安装JDK1.8+,并设置环境变量 搭建zookeeper集群 搭建Hadoop集群 Spark local模式 上传编译完成的spark安装程序到服务器上,并解压到指定目录 [root ...

  4. sql: having使用,及删除重复数据

    写了好几年的sql,having语句基本上很少写,这就有一点尴尬了,现在总结一下having的作用,每日整理一下学习文档. having 通常伴随group by使用,过滤group by的数据集. ...

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

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

  6. 数据库学习之中的一个: 在 Oracle sql developer上执行SQL必知必会脚本

    1 首先在開始菜单中打开sql developer: 2. 创建数据库连接 点击左上角的加号 在弹出的对话框中填写username和password 測试假设成功则点击连接,记得角色要写SYSDBA ...

  7. Linux改变文件所有者

    Linux改变文件所有者 #把当前路径下jsportal文件夹及下的所有文件的所有者改为appmanager组下的appmanager用户.chown -R -v appmanager:appmana ...

  8. Hive学习之路 (八)Hive中文乱码

    Hive注释中文乱码 创建表的时候,comment说明字段包含中文,表成功创建成功之后,中文说明显示乱码 create external table movie( userID int comment ...

  9. JVM(一)Java内存模型

    前言 对于从事C.C++程序开发的开发人员来说,在开始使用对象之前,他们都需要使用new关键字为对象申请内存空间,在使用完对象之后,也需要使用delete关键字来释放对象占用的内存空间.对于Java程 ...

  10. Spring事务(一)JDBC方式下的事务使用示例

    摘要: 本文结合<Spring源码深度解析>来分析Spring 5.0.6版本的源代码.若有描述错误之处,欢迎指正. 目录 一.创建数据表结构 二.创建对应数据表的PO 三.创建表与实体间 ...