1、html5中的属性选择器

<body>

<style type=text/css>

<!--1>完全匹配选择器-->

[id=test]{

  color:red;

  //比较严格只是匹配元素中的id是test的选择器

}

<!--2>包含匹配属性选择器-->

[id*=test]{

  color:green;

//相比较完全匹配的属性选择器这个的范围要广泛,只要是选择器的值中要test就可以被改变

}

<!--3>首部字符匹配属性选择器-->

[id^=test]{

  color:blue;

//只要是选择其中的头部是test的话,就会受到影响

}

<!--尾部字符属性选择器-->

[id$=test]{

  color:yellow;

}

//只要是属性选择器的尾部是test就会受到影响

</style>

<div id="test">Hello</div>

<div id="mytest">World</div>

<div id="tests>Thinks</div>

</body>

html5中的选择器的更多相关文章

  1. HTML5中class选择器属性的解释

    设置有class属性值的元素,可以被css中的选择器调用,也可以在javascript中以getElementsByClassName()方法调用. 可以给各个元素添加class而且名称可以相同与id ...

  2. 第87天:HTML5中新选择器querySelector的使用

    一.HTML5新选择器 1.document.querySelector("selector");selector:根据CSS选择器返回第一个匹配到的元素,如果没有匹配到,则返回n ...

  3. HTML5中DOM元素的querySelector/querySelectorAll的工作机制

    在HTML5中,提供了强大的DOM元素选择API querySelector/querySelectorAll,允许使用JavaScript代码来完成类似CSS选择器的DOM元素选择功能.通常情况下, ...

  4. 使用HTML5的JS选择器操作页面中的元素

    文件命名为:querySelector.html,可在Chrome浏览器中预览效果. 1 <!DOCTYPE html> 2 <html lang="en"> ...

  5. 使用HTML5的JavaScript选择器操作页面中的元素

    <!doctype html><html lang="en"> <head>     <meta charset="UTF-8& ...

  6. 小强的HTML5移动开发之路(34)——jQuery中的选择器

    一.jQuery是什么? jQuery是由美国人John Resig创建,至今吸引了来自世界各地的众多javascript高手加入其中. jQuery的创始人和技术领袖,目前在Mozilla担任Jav ...

  7. HTML5中a标签的锚点使用

    前几天有个用户问我关于在线手册功能里的锚点问题.因为他通过代码发现,在编辑手册内容时,锚点的设置是通过id选择器来制定的,而不是带有name属性的a标签.其实这是HTML5和HTML4(XHTML)等 ...

  8. HTML5 中 40 个最重要的技术点

    介绍 我是一个ASP.NET MVC的开发者,最近在我找工作的时候被问到很多与HTML5相关的问题和新特性.所以以下40个重要的问题将帮助你复习HTML5相关的知识. 这些问题不是你得到工作的高效解决 ...

  9. HTML5的JavaScript选择器介绍

    在HTML5出现之前使用JavaScript查找DOM元素,有以下三种原生的方法: getElementById:根据指定元素的id属性返回元素 getElementsByName:返回所有指定nam ...

随机推荐

  1. CF 36E Two Paths

    传送门 真实的自闭= =+ 考试的时候老师明明说了可以路径为空T^T 然后光荣的挂掉了 20分的链[明明是最送分的] 上来就看出来欧拉回路了嘛 然后思考了一下大概奇点配个对 删一条简单路径剩下的跑欧拉 ...

  2. 百度小程序-map组件定位

    给客户开发一个百度小程序,有个地图定位显示.百度小程序内置的api地图是不准的,通过百度一下,查询到坐标偏移算法公式,自己项目中使用,手机测试坐标已经正常显示! 经纬度,通过百度坐标拾取器拾取到! . ...

  3. Apache Flink 的迁移之路,2 年处理效果提升 5 倍

    一.背景与痛点 在 2017 年上半年以前,TalkingData 的 App Analytics 和 Game Analytics 两个产品,流式框架使用的是自研的 td-etl-framework ...

  4. java 序列化机制

    package stream; import java.io.FileInputStream; import java.io.FileNotFoundException; import java.io ...

  5. 解决“element表单验证输入的数字检测出来是string”的问题

    form表单: 校验规则: 注意:一.数字类型的验证需要在 v-model 处加上 .number 的修饰符,这是 Vue 自身提供的用于将绑定值转化为 number 类型的修饰符.二.校验中是否添加 ...

  6. BUUCTF | CODE REVIEW 1 (反序列化,md5绕过)

    <?php /** * Created by PhpStorm. * User: jinzhao * Date: 2019/10/6 * Time: 8:04 PM */ highlight_f ...

  7. [CSP-S模拟测试]:Lighthouse(哈密顿回路+容斥)

    题目背景 $Billions\ of\ lighthouses...stuck\ at\ the\ far\ end\ of\ the\ sky.$ 题目描述 平面有$n$个灯塔,初始时两两之间可以相 ...

  8. 2018-2019-2 实验三 敏捷开发与XP实践

    实验内容 1.XP基础 2.XP核心实践 3.相关工具 实验要求 1.没有Linux基础的同学建议先学习<Linux基础入门(新版)><Vim编辑器> 课程 2.完成实验.撰写 ...

  9. Hibernate:More than one row with the given identifier was found解决办法

    今天写一个Action 通过 HQL 查询一个表 出现异常 “More than one row with the given identifier was found” 问题原因: 数据库出现数据异 ...

  10. 高并发大流量专题---10、MySQL数据库层的优化

    高并发大流量专题---10.MySQL数据库层的优化 一.总结 一句话总结: mysql先考虑做分布式缓存,过了缓存后就做mysql数据库层面的优化 1.mysql数据库层的优化的前面一层是什么? 数 ...