CSS代码:
::-webkit-datetime-edit { padding: 1px; background: url(/study/image/selection.gif); }
::-webkit-datetime-edit-fields-wrapper { background-color: #eee; }
::-webkit-datetime-edit-text { color: #4D90FE; padding: 0 .3em; }
::-webkit-datetime-edit-year-field { color: purple; }
::-webkit-datetime-edit-month-field { color: blue; }
::-webkit-datetime-edit-day-field { color: green; }
::-webkit-inner-spin-button { visibility: hidden; }
::-webkit-calendar-picker-indicator {
border: 1px solid #ccc;
border-radius: 2px;
box-shadow: inset 0 1px #fff, 0 1px #eee;
background-color: #eee;
background-image: -webkit-linear-gradient(top, #f0f0f0, #e6e6e6);
color: #666;
}
HTML代码:
<input type="date" />

伪元素改变date类型input框的默认样式实例页面的更多相关文章

  1. 消除input框的默认样式

    input, button, select, textarea { outline: none; -webkit-appearance: none; border-radius: 0; } outli ...

  2. file类型input框设置上传相同文件,并都可以触发change事件。

    在使用file类型input框是,删除了第一次上传到文件,再次上传相同文件,无法触发change事件,所以在删除的js上添加如下js代码: document.getElementById('fileU ...

  3. 在vue组件的stylus样式总 取消search类型的input按钮中默认样式

    在vue组件的stylus样式中 取消search类型的input按钮中默认样式 记录一个坑 环境 Vue组件 使用了Stylus的CSS风格. 问题 input输入框使用了 type="s ...

  4. input框的默认bug解决办法

    input框的默认bug是在没干掉边框的情况下是不能设置背景颜色的,否则边框会变成内边框(黑色)效果,很难看. 解决办法是: none掉input框的边框:border:none; 再设置其背景色为任 ...

  5. 用纯css改变下拉列表select框的默认样式(转)

    用纯css改变下拉列表select框的默认样式 分享到 分类 JS学习   关键字 前端   发布 kris  2015-04-01 注意 转载须保留原文链接,译文链接,作者译者等信息.     在这 ...

  6. HTML复选框checkbox默认样式修改

    此方法可以将复选框的默认样式替换成任意样式.如图: 未选择: 选择时: 思路:将复选框隐藏,利用lebal元素的焦点传递特性,用lebal的样式替代复选框. 代码如下: <!DOCTYPE ht ...

  7. input时间表单默认样式修改(input[type="date"])

    一.时间选择的种类: HTML代码:选择日期:<input type="date" value="2018-11-15" /> 选择时间:<i ...

  8. 用纯css改变下拉列表select框的默认样式

    http://ourjs.com/detail/551b9b0529c8d81960000007 在这篇文章里,我将介绍如何不依赖JavaScript用纯css来改变下拉列表框的样式. 问题的提出 事 ...

  9. CSS效果:CSS改变下拉列表select框的默认样式

    原理 原理是将浏览器默认的下拉框样式清除,然后应用上自己的,再附一张向右对齐小箭头的图片即可.当然右侧的小箭头可以用伪元素before或者after来实现. select { /*Chrome和Fir ...

随机推荐

  1. EasyUI应用总结

    1 <%@ page language="java" contentType="text/html; charset=utf-8" 2 pageEncod ...

  2. BurpSuite系列(十一)----Project options模块(项目选择)

    一.简介 Project options主要用来对Project的一些设置. 二.模块说明 Project options主要由五个模块组成: 1.Connections 连接2.HTTP3.SSL4 ...

  3. Python基础学习三 字典、元组

    一.元组 元组,提示别人,这个值是不能被改变的,元组的定义方式是用(),小括号: 元组只有两个方法,那就是count和index mysql1 = ('127.0.0.1',3306,'my','ro ...

  4. C51串口的SCON寄存器及工作…

    原文地址:C51串口的SCON寄存器及工作方式作者:batistar 一,串行口控制寄存器SCON 它用于定义串行口的工作方式及实施接收和发送控制.字节地址为98H,其各位定义如下表: D7 D6 D ...

  5. Linux的基本指令--

     VIM简介: Vi有三种基本工作模式 1.命令模式 2.文本输入模式 3. 末行模式 VIM基本操作: 一 . 进入插入模式: i: 插入光标前一个字符 I: 插入行首 a: 插入光标后一个字符 A ...

  6. T-SQL 理解SQL SERVER中的分区表(转)

    转载来源一定要明显:  http://www.cnblogs.com/CareySon/archive/2011/12/30/2307766.html 而且这个大神对于数据库方面的文章非常棒 强烈推荐 ...

  7. ISAP网络流算法

    ISAP全称Improved Shortest Augmenting Path,意指在SAP算法进行优化.SAP即Edmonds-Karp算法,其具体思路是通过不断向残存网络推送流量来计算整个网络的最 ...

  8. 在web.Config文件中添加数据库连接配置

    新建一个网站,打开web.config文件,在connectionString配置节点添加add节点进行数据库进行数据库连接配置代码如下: <connectionStrings> < ...

  9. 自定义的parse_url逆向函数http_build_url,将数组转为url字符串

    parse_url函数可以讲一个url字符串解析成一个数组,但是php中似乎没有parse_url的逆向函数来讲一个解析出来的数组组合成url字符串,只有一个http_build_query用来将数组 ...

  10. 717. 1-bit and 2-bit Characters最后一位数是否为0

    [抄题]: We have two special characters. The first character can be represented by one bit 0. The secon ...