1、如何去掉input type=date 默认样式

HTML代码:
选择日期:<input type="date" value="2017-06-01" />
选择时间:<input type="time" value="22:52" />
选择星期:<input type="week" />
选择月份:<input type="month" />

目前WebKit下有如下9个伪元素可以改变日期控件的UI:

::-webkit-datetime-edit – 控制编辑区域的
::-webkit-datetime-edit-fields-wrapper – 控制年月日这个区域的
::-webkit-datetime-edit-text – 这是控制年月日之间的斜线或短横线的
::-webkit-datetime-edit-month-field – 控制月份
::-webkit-datetime-edit-day-field – 控制具体日子
::-webkit-datetime-edit-year-field – 控制年文字, 如2017四个字母占据的那片地方
::-webkit-inner-spin-button – 这是控制上下小箭头的
::-webkit-calendar-picker-indicator – 这是控制下拉小箭头的
::-webkit-clear-button –这是控制清除按钮的

2、去掉input type=number的默认样式

input[type=number] { -moz-appearance:textfield;}
::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0;} 控制编辑上下箭头的
::-webkit-input-placeholder 控制placeholder样式
:-moz-placeholder
::-moz-placeholder
:-ms-input-placeholder

html5中如何更改、去掉input type默认样式的更多相关文章

  1. html5中如何去掉input type date默认

    html5中如何去掉input type date默认样式 2.对日期时间控件的样式进行修改目前WebKit下有如下9个伪元素可以改变日期控件的UI:::-webkit-datetime-edit – ...

  2. 【转】html5中如何去掉input type date默认样式

    html5中如何去掉input type date默认样式1.时间选择的种类:HTML代码: 选择日期:<input type="date" value="2017 ...

  3. html5中如何去掉input type date默认样式

    html5中如何去掉input type date默认样式 1.时间选择的种类: HTML代码: 选择日期:<input type="date" value="20 ...

  4. 【转】自定义(滑动条)input[type="range"]样式

    1.如何使用滑动条? 用法很简单,如下所示: <input type="range" value="0"> 各浏览器原始样式如下: Chrome:  ...

  5. 定制 input[type="radio"] 和 input[type="checkbox"] 样式

    表单中,经常会使用到单选按钮和复选框,但是,input[type="radio"] 和 input[type="checkbox"] 的默认样式在不同的浏览器或 ...

  6. 移动端去掉按钮button默认样式

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  7. css input[type=file] 样式美化,input上传按钮美化

    css input[type=file] 样式美化,input上传按钮美化 参考:http://www.haorooms.com/post/css_input_uploadmh

  8. 去掉input[type="number"]的默认样式

    input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{ -webkit-appearance: none !importa ...

  9. 去掉 input type="number" 在浏览器中遗留的图标样式

    input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{  /* chrome */     -webkit-appeara ...

随机推荐

  1. EOS源码

    [EOS源码] 1.在 libraries/chain/include/eosio/chain/ 目录下. permission_level 定义如下:   account_name.permissi ...

  2. linux 安装java环境

    1.检查是否安装或者linux系统自带jdK 命令:java -version 查找JDK相关包是否被安装: rpm -qa |grep jdk rpm -qa |grep gcj 删除JDK相关包: ...

  3. IIS 设置查询字符串长度

  4. 腾讯2019年暑期实习生招聘提前批在线笔试技术研究和数据分析方向t2(python)

    小Q有一叠纸牌,一共有n张,从上往下依次编号为1~n.现在小Q要进行以下重复操作:把位于顶端的牌扔掉,把新的顶端的牌放到这叠牌的底部.小Q会一直操作到只剩下一张牌为止,小Q想知道每次扔掉的牌的编号.[ ...

  5. scapy基础之一 ----简单命令

    前言 scapy是python写的一个功能强大的交互式数据包处理程序,可用来发送.嗅探.解析和伪造网络数据包,常常被用到网络攻击和测试中.下面介绍简单命令. ls() List all availab ...

  6. unity插件各领域王者

    移动端手势操作 Easy Touch 获取 缓动 iTween 获取 可视化编程 Playmaker1.9.0 获取 UI NGUI,UGUI 获取 Shader着色器可视化编程 AmplifySha ...

  7. Hadoop环境搭建--Docker完全分布式部署Hadoop环境(菜鸟采坑吐血整理)

    系统:Centos 7,内核版本3.10 本文介绍如何从0利用Docker搭建Hadoop环境,制作的镜像文件已经分享,也可以直接使用制作好的镜像文件. 一.宿主机准备工作 0.宿主机(Centos7 ...

  8. Hillstone设备管理-设备软件Stone-OS升级

    1.通过sysloader进行StoneOS升级 1)给设备上电按提示按ESC并且进入 Sysloader.参照以下操作提示: 2)在下面选择对应的选项升级os,可以通过tftp.ftp.usb.系统 ...

  9. tp3.2 上传文件及下载文件

    公共方法 UploadFile.class.php() // 开始 , , , ,];];,; ;; ::::::;,) {//文件上传失败 //捕获错误代码$this->error($file ...

  10. python day03_ 文件处理

    一.文件操作的基本流程 计算机操作文件的过程 #1. 打开文件,得到文件句柄并赋值给一个变量 #2. 通过句柄对文件进行操作 #3. 关闭文件 1.文件的打开过程 # f被程序持有,文件被操作系统持有 ...