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. 十分钟理解Redux核心思想,过目不忘。

    白话Redux工作原理.浅显易懂. 如有纰漏或疑问,欢迎交流. Redux 约法三章 唯一数据源(state) 虽然redux中的state与react没有联系,但可以简单理解为react组件中的th ...

  2. JDK1.8新特性之Stream类初识

    JDK1.8新特性之Stream类初识 import java.util.Arrays; import java.util.List; import java.util.Optional; impor ...

  3. SpringBoot---概述

    1.概述 1.1.SpringBoot解决什么问题? 1.1.1.配置---> 自动化配置 1.1.2.依赖---> SpringBoot提供了一系列的Start POM,整合各项功能的时 ...

  4. 浅析 http 接口

     一.HTTP接口 Http协议是建立在TCP协议基础之上的,当浏览器需要从服务器获取网页数据的时候,会发出一次Http请求.Http会通过TCP建立起一个到服务器的连接通道,当本次请求需要的数据完毕 ...

  5. vue 全局 js 方法

    1.新增 getCurrentDataType.js 文件 import cookieUtils from '@/config/cookieUtils' function getCurrentData ...

  6. iOS 常用随机数

    比如:获取一个随机整数范围在:[0,100)包括0,不包括100 ; 参考:https://www.jianshu.com/p/106475cbd3da

  7. element-ui中的loading的实际应用

    实际开发中,要如何指定loading在我们想要的区域加遮罩呢? 前提: 你已经引入element-ui,如下: import ElementUI from 'element-ui' import { ...

  8. 手机上访问angular移动项目

    要实现手机访问本地开发的移动端项目,首先做到两点: 1.本地打开的项目可以使用本地ip访问 2.手机和电脑同时处于一个同一个局域网中(手机和电脑同时连上同一个wifi / 手机开热点给电脑 / 电脑开 ...

  9. EditText设置/隐藏光标位置、选中文本和获取/清除焦点(转)

    转:http://blog.csdn.net/dajian790626/article/details/8464722 有时候需要让光标显示在EditText的指定位置或者选中某些文本.同样,为了方便 ...

  10. C# JS 前后端互传数据

    ---恢复内容开始--- 后端: public void ProcessRequest(HttpContext context) { context.Response.ContentType = &q ...