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. ARTS打卡计划第一周-Algorithm

    7. Reverse Integer import math class Solution: def reverse(self, x: int) -> int: ret = 0 if x > ...

  2. JS创建一个数组1.求和 2.求平均值 3.最大值 4.最小值 5.数组逆序 6.数组去重 0.退出

    rs = require("readline-sync"); let arr = []; console.log("请输入数组的长度:"); let arr_l ...

  3. (1234队)NABCD分析

    1.N(需求) 我们通过平常上自习时发现的问题和在校调查发现人们在寻找空教室上自习时会遇到诸多问题,其中 问题一:找不到空教室:5% 问题二:非上课教室学生太多:70% 问题三:有占座情况:20% 问 ...

  4. java之JUC

    1.JUC简介 java的JUC即java.util.concurrent包,

  5. 关于socket

    使用socket常用的操作就是读写,recv和send,与read.write对应,但多了一个flag位可以设定阻塞等,一些细节以后再探.目前使用时发现read往往不能将数据完整读出,可能是调用时内核 ...

  6. systemverilog soft constraint

    1.class my_item; rand bit constrainted_random; rand bit usually_one; endclass class my_generator; my ...

  7. tensorflow实现二分类

    读万卷书,不如行万里路.之前看了不少机器学习方面的书籍,但是实战很少.这次因为项目接触到tensorflow,用一个最简单的深层神经网络实现分类和回归任务. 首先说分类任务,分类任务的两个思路: 如果 ...

  8. docker制作镜像

    使用Dockerfile脚本创建jdk1.8镜像 新建jdk目录:(-p表示需要父目录,不然就会出错) mkdir -p /usr/local/dockerjdk1. 将jdk的压缩文件复制到上面的路 ...

  9. trunk端口配置错误导致环路

    端口下 switchport mode trunk spannning-tree portfast 上述两个命令同时执行将导致环路

  10. Loadrunner 11.00录制App脚本篇(Win10)

    参考博文1:https://www.cnblogs.com/mxqh2016/p/6016866.html 参考博文2:https://blog.csdn.net/myohmy2008/article ...