如果 input 元素中的值是非法的，实时提醒

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>菜鸟教程(runoob.com)</title>

<style>

span{

    display:none;

    color:#f00;

}

input:invalid + span{

    display:block;

}

</style>

</head>

<body>

<h3> :invalid 选择器实例演示。</h3>

<input type="email" value="supportEmail" />

<span>格式不正确</span>

<p>请输入合法 e-mail 地址，查看样式变化。</p>

</body>

</html>

：

CSS :invalid 选择器的更多相关文章

  1. CSS的选择器

    <div id="demo"> <div class="inner"> <p><a href="#" ...

  2. JS实战 · 仿css样式选择器

    代码如下: <html> <head>     <meta http-equiv="Content-Type" content="text/ ...

  3. CSS 后代选择器

    后代选择器(descendant selector)又称为包含选择器. 后代选择器可以选择作为某元素后代的元素. 根据上下文选择元素 我们可以定义后代选择器来创建一些规则,使这些规则在某些文档结构中起 ...

  4. css后代选择器（div.class中间不带空格）

    如果我要查找<div>上用了.class的元素,查找方法:div.class:中间是不空格的. 以上这种形式为css后代选择器 参考:http://www.w3school.com.cn/ ...

  5. CSS样式选择器优先级

    CSS样式选择器分为4个等级,a.b.c.d,可以以这四种等级为依据确定CSS选择器的优先级. 1.如果样式是行内样式(通过Style=””定义),那么a=12.b为ID选择器的总数3.c为Class ...

  6. css中选择器的使用

    css是英文Cascading Style Sheets的缩写.它是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言.我们再将html比喻 ...

  7. CSS 派生选择器

    派生选择器 通过依据元素在其位置的上下文关系来定义样式,你可以使标记更加简洁. 在 CSS1 中,通过这种方式来应用规则的选择器被称为上下文选择器 (contextual selectors),这是由 ...

  8. CSS 类选择器

    在 CSS 中,类选择器以一个点号显示: .center {text-align: center} 在上面的例子中,所有拥有 center 类的 HTML 元素均为居中. 在下面的 HTML 代码中, ...

  9. CSS id 选择器

    id 选择器 id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式. id 选择器以 "#" 来定义. 下面的两个 id 选择器,第一个可以定义元素的颜色为红色,第二 ...

随机推荐

  1. java 按概率产生

    import java.util.Random; import org.junit.Test; public class Demo1 { public void getChance(int perce ...

  2. $Min\_25$筛学习笔记

    \(Min\_25\)筛学习笔记 这种神仙东西不写点东西一下就忘了QAQ 资料和代码出处 资料2 资料3 打死我也不承认参考了yyb的 \(Min\_25\)筛可以干嘛?下文中未特殊说明\(P\)均指 ...

  3. 洛谷P3868 [TJOI2009]猜数字（中国剩余定理，扩展欧几里德）

    洛谷题目传送门 90分WA第二个点的看过来! 简要介绍一下中国剩余定理 中国剩余定理,就是用来求解这样的问题: 假定以下出现数都是自然数,对于一个线性同余方程组(其中\(\forall i,j\in[ ...

  4. ra (数论 , 莫比乌斯反演 , 整点统计)

    题意 求 \[\displaystyle \sum_{i=1}^{n} \sum_{j=1}^{n} [\mathrm{lcm} (i,j) > n] \pmod {10^9 + 7}\] . ...

  5. BZOJ 1778: [Usaco2010 Hol]Dotp 驱逐猪猡

    1778: [Usaco2010 Hol]Dotp 驱逐猪猡 Time Limit: 10 Sec  Memory Limit: 64 MBSubmit: 563  Solved: 216[Submi ...

  6. 【BZOJ2227】[ZJOI2011]看电影（组合数学，高精度）

    [BZOJ2227][ZJOI2011]看电影(组合数学,高精度) 题面 BZOJ 洛谷 题解 这题太神仙了. 首先\(K<N\)则必定无解,直接特判解决. 现在只考虑\(K\ge N\)的情况 ...

  7. 一个数学不好的菜鸡的快速沃尔什变换(FWT)学习笔记

    一个数学不好的菜鸡的快速沃尔什变换(FWT)学习笔记 曾经某个下午我以为我会了FWT,结果现在一丁点也想不起来了--看来"学"完新东西不经常做题不写博客,就白学了 = = 我没啥智 ...

  8. 洛谷 P3962 [TJOI2013]数字根 解题报告

    P3962 [TJOI2013]数字根 题意 数字根:这个数字每一位的数字加起来求和,反复这个过程直到和小于10. 给出序列\(a\),询问区间\([l,r]\)连续的子区间里最大前5个不同的数字根, ...

  9. 洛谷 P2725 邮票 Stamps 解题报告

    P2725 邮票 Stamps 题目背景 给一组 N 枚邮票的面值集合(如,{1 分,3 分})和一个上限 K -- 表示信封上能够贴 K 张邮票.计算从 1 到 M 的最大连续可贴出的邮资. 题目描 ...

  10. SQL Server关于WITH CUBE、WITH ROLLUP和GROUPING使用

    通过查看sql 2005的帮助文档找到了CUBE 和 ROLLUP 之间的具体区别:CUBE 生成的结果集显示了所选列中值的所有组合的聚合.ROLLUP 生成的结果集显示了所选列中值的某一层次结构的聚 ...