palacehoder的自定义样式【输入框input /文本域textarea】
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】的更多相关文章
- Bootstrap 表单控件一(单行输入框input,下拉选择框select ,文本域textarea)
单行输入框,常见的文本输入框,也就是input的type属性值为text.在Bootstrap中使用input时也必须添加type类型,如果没有指定type类型,将无法得到正确的样式,因为Bootst ...
- 解决:HTML中多文本域(textarea)回车后数据存入数据库,EL表达式取出异常。
问题描述: 当多文本域(textarea)回车后数据存入数据库. EL表达式取出异常,值换行倒置页面报错. 问题解决: 存值脚本代码,提交前转换\n为<br/>. <script t ...
- 文本域textarea
文本域 CreateTime--2017年5月23日15:12:08Author:Marydon 二.文本域 (一)语法 <textarea></textarea> (二) ...
- HTML中<input>參数,以及文本输入框,文本域的解说
<form> <input type="text/password" name="名称" value="文本" /> ...
- Bootstrap系列 -- 16. 文本域textarea
文本域和原始使用方法一样,设置rows可定义其高度,设置cols可以设置其宽度.但如果textarea元素中添加了类名“form-control”类名,则无需设置cols属性.因为Bootstrap框 ...
- html文本域textarea高度自增、自动换行
文本域自动换行.高度自增,采用以下方式: html: <textarea rows="1" class="answerTextArea" maxlengt ...
- 文本域textarea的一个小细节
文本域代码在编写时,最好写在一行上,就像: 如果没写在一行上,如: 那么就会在后续生成的页面上输入的时候就会产生一段空白无法删除: 这是写文本框的时候的一个小细节
- css 文本域textarea显示成label标签
<html> <head> <title>textarea显示为label</title> <style type="text/ ...
- 文本域textarea显示输入剩余字数
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- (三) Keras Mnist分类程序以及改用交叉熵对比
视频学习来源 https://www.bilibili.com/video/av40787141?from=search&seid=17003307842787199553 笔记 Mnist分 ...
- Android为TV端助力 外挂字幕(设置颜色,大小,位置,微调字幕)
前提摘要: 可以给电影加字幕,目前支持srt和ass格式, 功能摘要: 支持微调字幕,设置大小,颜色,位置 1 .字幕解析类 package com.hhzt.iptv.lvb_x.utils; ...
- DVWA 黑客攻防演练(十二) DOM型 XSS 攻击 DOM Based Cross Site Scripting
反射型攻击那篇提及到,如何是"数据是否保存在服务器端"来区分,DOM 型 XSS 攻击应该算是 反射型XSS 攻击. DOM 型攻击的特殊之处在于它是利用 JS 的 documen ...
- java8及8之前日期相关类
java 8日期相关类 Instant:精确到纳秒的时间戳 Duration:处理有关基于时间的时间量 LocalDate:只包含日期,比如:2016-10-20 LocalTime:只包含时间,比如 ...
- 关于Java中基类构造器的调用问题
在<Java编程思想>第7章复用类中有这样一段话,值得深思.当子类继承了父类时,就涉及到了基类和导出类(子类)这两个类.从外部来看,导出类就像是一个与基类具有相同接口的新类,或许还会有一些 ...
- arts打卡 从排序数组中删除重复项
Algorithm 从排序数组中删除重复项 给定一个排序数组,你需要在原地删除重复出现的元素,使得每个元素只出现一次,返回移除后数组的新长度. 不要使用额外的数组空间,你必须在原地修改输入数组 ...
- [SNOI2017]炸弹
嘟嘟嘟 这题有一些别的瞎搞神奇做法,而且复杂度似乎更优,不过我为了练线段树,就乖乖的官方正解了. 做法就是线段树优化建图+强连通分量缩点+DAGdp. 如果一个炸弹\(i\)能引爆另一个炸弹\(j\) ...
- 在Winform开发中使用Grid++报表
之前一直使用各种报表工具,如RDLC.DevExpress套件的XtraReport报表,在之前一些随笔也有介绍,最近接触锐浪的Grid++报表,做了一些测试例子和辅助类来处理报表内容,觉得还是很不错 ...
- BigDecimal比较大小,BigDecimal判断是否为0
原文:https://blog.csdn.net/qq_34926773/article/details/83419004 BigDecimal类型的数据,需要比较大小:声明BigDescimal: ...
- 关于H5从PC端切换到移动端,屏幕显示内容由横向转为竖向的研究!
1.前言: 在项目中,我们常会遇见在手机端需要横屏观看的效果,而在pc端则默认切换到竖屏的样式. 或者是,UI提供的图是一个长图,但是在移动端我们需要让这个图在手机横屏时显示. 以上两个都需要我们实行 ...