7.palacehoder的自定义样式【输入框input /文本域textarea】

因为每个浏览器的CSS选择器都有所差异,所以需要针对每个浏览器做单独的设定(可以在冒号前面写input和textarea)。  

::-webkit-input-placeholder { /* WebKit browsers */  

 color:#999;   

}  

:-moz-placeholder { /* Mozilla Firefox 4 to 18 */  

  color:#999;   

}  

::-moz-placeholder { /* Mozilla Firefox 19+ */  

 color:#999;   

}   

:-ms-input-placeholder { /* Internet Explorer 10+ */   

  color:#999;   

}

还可以写成下面这样:  

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {  

 color: #666;  

}   

input:-moz-placeholder, textarea:-moz-placeholder {   

color:#666;   

}   

input::-moz-placeholder, textarea::-moz-placeholder {   

color:#666;   

}   

input:-ms-input-placeholder, textarea:-ms-input-placeholder {   

color:#666;   

}

知识点:单冒号(:)用于CSS3伪类,双冒号(::)用于CSS3伪元素。  

css伪元素:CSS 伪元素用于向某些选择器设置特殊效果。   

伪元素由双冒号和伪元素名称组成。

双冒号是在当前规范中引入的,用于区分伪类和伪元素。

但是伪类兼容现存样式,浏览器需要同时支持旧的伪类, 如:first-line,:first-letter,:before,:after等等。

因此对于css2之前已经有的伪元素两种写法的作用是一样的,但是为了兼容IE浏览器还是使用单冒号的写法。

palacehoder的自定义样式【输入框input /文本域textarea】的更多相关文章

  1. Bootstrap 表单控件一(单行输入框input,下拉选择框select ,文本域textarea)

    单行输入框,常见的文本输入框,也就是input的type属性值为text.在Bootstrap中使用input时也必须添加type类型,如果没有指定type类型,将无法得到正确的样式,因为Bootst ...

  2. 解决:HTML中多文本域(textarea)回车后数据存入数据库,EL表达式取出异常。

    问题描述: 当多文本域(textarea)回车后数据存入数据库. EL表达式取出异常,值换行倒置页面报错. 问题解决: 存值脚本代码,提交前转换\n为<br/>. <script t ...

  3. 文本域textarea

      文本域 CreateTime--2017年5月23日15:12:08Author:Marydon 二.文本域 (一)语法 <textarea></textarea> (二) ...

  4. HTML中&lt;input&gt;參数,以及文本输入框,文本域的解说

    <form> <input type="text/password" name="名称" value="文本" /> ...

  5. Bootstrap系列 -- 16. 文本域textarea

    文本域和原始使用方法一样,设置rows可定义其高度,设置cols可以设置其宽度.但如果textarea元素中添加了类名“form-control”类名,则无需设置cols属性.因为Bootstrap框 ...

  6. html文本域textarea高度自增、自动换行

    文本域自动换行.高度自增,采用以下方式: html: <textarea rows="1" class="answerTextArea" maxlengt ...

  7. 文本域textarea的一个小细节

    文本域代码在编写时,最好写在一行上,就像: 如果没写在一行上,如: 那么就会在后续生成的页面上输入的时候就会产生一段空白无法删除: 这是写文本框的时候的一个小细节

  8. css 文本域textarea显示成label标签

    <html> <head>     <title>textarea显示为label</title> <style type="text/ ...

  9. 文本域textarea显示输入剩余字数

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. IntentService原理分析

    IntentService是一个异步处理请求的服务,通过Context#startService(Intent)可以将请求发送给IntentService,IntentService在工作线程中依次串 ...

  2. 常见的异步方式async 和 await

    之前研究过c#的async和await关键字,幕后干了什么,但是不知道为什么找不到相关资料了.现在重新研究一遍,顺便记录下来,方便以后查阅. 基础知识 async 关键字标注一个方法,该方法返回值是一 ...

  3. 第六篇Scrum冲刺博客

    一.Daily Scrum Meeting照片 二.每个人的工作 成员 ItemID 已完成工作 明天计划完成的工作 遇到的困难 张鸿 o1 已完成工作,实现积分变换,碰撞检测 将其他剩余功能进行整合 ...

  4. 扫码下单支持同桌单人点餐FAQ

    一.使用场景 满足较多商户希望同一桌台,各自点各自的菜品的业态场景(例如杭味面馆,黄焖鸡米饭店,面馆等大多数轻快餐店) 二.配置步骤及注意事项 管理员后台配置--配置管理--店铺配置--扫码点餐tab ...

  5. django logging

    LOG_LEVEL = 'DEBUG' LOGGING = { 'version' : 1, 'disable_existing_loggers' : True, 'formatters' : { ' ...

  6. python中json文件处理涉及的四个函数json.dumps()和json.loads()、json.dump()和json.load()的区分

    一.概念理解 1.json.dumps()和json.loads()是json格式处理函数(可以这么理解,json是字符串) (1)json.dumps()函数是将一个Python数据类型列表进行js ...

  7. js 判断元素(例如div)里的数据显示不全(数据长度大于元素长度)

    //判断div里元素是否超出长度,true 超出,false 没有 dom=document.getElementById('id');function isEllipsis(dom) {    va ...

  8. 在html代码中js的script标签建议放在那里?

    今天编写了一个简单的js代码,F12有错误,然后发现是<script>放的位置有问题.之前在我的印象当中,说的是这个标签放在哪里都可以,然而...并不是这样的,例如我现在练习的这个代码,写 ...

  9. Node.js如何执行cmd

    最近正好因业务的一个需求需要研究如何根据vscode的插件名来下载对应的插件以解决之前将插件打包上传到服务器上面导致的延迟问题(插件体积小还好说,如果体积过大,即便是压缩打成zip包,如果同一时刻很多 ...

  10. 编译装php7.2 && nginx-1.14

    环境准备 # cat /etc/centos-release CentOS Linux release 7.6.1810 (Core) # uname -r 3.10.0-957.el7.x86_64 ...