html5中的选择器

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>

时间: 2024-08-16 09:52:26

html5中的选择器的相关文章

HTML5中class选择器属性的解释

设置有class属性值的元素,可以被css中的选择器调用,也可以在javascript中以getElementsByClassName()方法调用. 可以给各个元素添加class而且名称可以相同与id正好相反,id属性一般建议少用,在小型网站中页面元素不多的情况下我们推荐是id,而在大众型网站我们推荐使用class 如: <div id="box">HTML5</div> 复制代码 class选择器 <div class="box"&g

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

上一篇文章介绍了HTML5新增的JavaScript选择器,今晚正式实践一下,使用HTML5的JS选择器操作页面中的元素. 文件命名为:querySelector.html,可在Chrome浏览器中预览效果. 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>使用HTML5的JS选择器操作页面中的元

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

本文为 兄弟连IT教育 机构官方 HTML5培训 教程,主要介绍:HTML5移动开发之路(34)--jQuery中的选择器 一.jQuery是什么? jQuery是由美国人John Resig创建,至今吸引了来自世界各地的众多JavaScript高手加入其中. jQuery的创始人和技术领袖,目前在Mozilla担任JavaScript工具开发工程师.著有<Pro JavaScript Techniques>(即<精通JavaScript>)等经典JavaScript书籍. jQu

html5中form表单新增属性以及改良的input标签元素的种类

在HTML5中,表单新增了一些属性,input标签也有了更多的type类型,有些实现了js才能实现的特效,但目前有些浏览器不能全部支持.下面是一些h5在表单和input标签上的一些改动. <!DOCTYPE html><html> <head> <title>表单测试</title> <meta charset="utf-8" /> <!-- 在不支持h5的浏览器中,可以用CSS样式进行改写 --> &

HTML5中类jQuery选择器querySelector的使用

HTML5中类jQuery选择器querySelector的使用 简介 HTML5向Web API新引入了document.querySelector以及document.querySelectorAll两个方法用来更方便地从DOM选取元素,功能类似于jQuery的选择器.这使得在编写原生JavaScript代码时方便了许多. 用法 两个方法使用差不多的语法,都是接收一个字符串参数,这个参数需要是合法的CSS选择语法. element = document.querySelector('sele

HTML5的JavaScript选择器介绍

在HTML5出现之前使用JavaScript查找DOM元素,有以下三种原生的方法: getElementById:根据指定元素的id属性返回元素 getElementsByName:返回所有指定name属性的元素 getElementsByTagName:返回所有指定标签的元素 HTML5新增的选择器,方法有两种: querySelector:根据选择器规则返回第一个符合要求的元素 querySelectorAll:根据选择器规则返回所有符合要求的元素 支持新的HTML5 JavaScript选

HTML5 中 40 个最重要的技术点

原文地址:http://www.oschina.net/news/56236/40-important-html-5-interview-questions-with-answers 介绍 我是一个ASP.NET MVC的开发者,最近在我找工作的时候被问到很多与HTML5相关的问题和新特性.所以以下40个重要的问题将帮助你复习HTML5相关的知识. 这些问题不是你得到工作的高效解决方案,但是可以在你想快速复习相关主题的时候有所帮助. 快乐地找工作. SGML(标准通用标记语言)和HTML(超文本

HTML5中新增的语义化标签,及在IE5.5~9(IE9已经开始支持部分HTML5新标签了)支持这些新标签的兼容性处理。

一.前言 本文将介绍HTML5中新增的语义化标签,及在IE5.5~9(IE9已经开始支持部分HTML5新标签了)支持这些新标签的兼容性处理. 目录一坨: 二.语义化标签:article.aside.time.mark.section.header.footer.hgroup.progress.figure.figcaption.nav.meter.output.details.summary.ruby和main   三.让IE5.5~9支持HTML5新标签 1. IE5.5~8下对于不支持的标签

4.html5中超链接和路径

html中超链接都是通过<a>标签实现的,html5也不例外,这里就来探讨一下<a>标签. <a>元素属于文本元素,有一些私有属性或者叫局部属性.那么,相对应的还有通用属性或叫做全局属性,全局属性是的问题我们以后再来探讨. 对于其私有属性有哪些,下面用一个表格进行了整理: 属性名称 说明 href 指定<a>元素所指资源的 URL hreflang 指向的链接资源所使用的语言 media 说明所链接资源用于哪种设备 rel 说明文档与所链接资源的关系类型 t