CSS3选择器在HTML5中的使用

1,有CLASS属性的input标记

Input[class]{

}

2,class属性是sm的元素

Input[class=‘sm‘]{}

3,  凡是class=sm的元素

[class=‘sm‘]{}

4,名字以sm开头的

Input[name^=sm]{}

5,名字以sm结尾的

Input[name$=sm]{}

6,名字包含sm的

Input[name*=sm]

伪类选择器

:hover

:link

:active

:visited

CSS3新增的伪类选择器

E:first-child  :E的父元素的第一个子元素

E:last-child  :E的父元素的最后一个子元素

E: nth-child(N): E的父元素的第N个元素

E:nth-last-child(n):E的父元素的倒数第N个元素

:root  类似于html ,文档根元素

伪对象选择器

:before   盒子内部前面加上一个行内显示的盒子

:after   盒子内部后面加上一个行内显示的盒子

必须和content结合使用

音频视频元素

1,音频

<audio src="muisc/anheqiao.mp3" autoplay="autoplay">不支持的播放格式</audio>

若无法播放显示标记中间的内容,

Autoplay 为自动播放

Controls为控制面板

2,视频

<video controls >

<source src="video/gaoxiao.mp4">

</video>

时间: 2024-08-04 11:29:27

CSS3选择器在HTML5中的使用的相关文章

CSS3选择器的研究,案例

在上一篇CSS3选择器的研究中列出了几乎所有的CSS3选择器,和伪类选择器,当是并没有做案例的研究,本想在那篇文章里面写,但想想如果把案例都写在那篇文章里面,对于查找来说就不是很方便,所有另开一篇来讲实例. 属性选择器 [title]:选择带有title属性的元素 [title='hello']:选择属性是title并且值是hello的元素 [title~='hello']:选择属性是title并且部分值是hello的元素,hello需要是单独的值,以空格分开 [title*='hello']:

htML+CSS3-》第3阶段:HTML5之CSS3基础与加强 中

HTML+CSS3->第3阶段:HTML5之CSS3基础与加强中 60前端开发基础视频-复合选择器之子元素选择器 子元素选择器,是让css选择器智能选择子辈的元素. 例如:h1>strong{color:red;} 解读为:选择器h1>strong可以解释为"选择作为h1元素子元素的所有strong元素". 61前端开发基础视频-属性选择器 属性选择器 <!DOCTYPE html> <html lang="zh"> <

让 IE9 以下的浏览器支持HTML5标签 和 CSS3选择器

做项目的很多时候,想用 HTML5  CSS3 新的技术,又考虑到低版本的浏览器不支持这些标签和属性,就让人烦恼,不过问题的出现,就有问题的解决方案,那么这里就介绍用 js 插件来让低版本浏览器也兼容吧... 让浏览器支持HTML5标签插件下载地址: http://code.google.com/p/html5shiv/ 让浏览器支持CSS3选择器插件下载地址: http://www.jb51.net/jiaoben/24032.html 使用方法: 下载插件,在下载到的文件中找到下面标着红颜色

使用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中的选择器

1.html5中的属性选择器 <body> <style type=text/css> <!--1>完全匹配选择器--> [id=test]{ color:red; //比较严格只是匹配元素中的id是test的选择器 } <!--2>包含匹配属性选择器--> [id*=test]{ color:green; //相比较完全匹配的属性选择器这个的范围要广泛,只要是选择器的值中要test就可以被改变 } <!--3>首部字符匹配属性选择器

使用选择器在页面中插入内容

我不知道是否有其他人能看见我写的内容,由于我是一个渣渣,很多内容都不知道,所以将这些很简单的东西都记录下来,希望不小心点进来的大神们,能吐槽一下我,呃指点一下我.和我一样的小白们希望能相互学习,谢谢了. 在css中可以使用before伪元素选择器 after伪元素选择器在页面中插入内容,而插入的内容由content属性来定义     一:使用选择器来插入文字 使用选择器来插入文字,在插入的内容是文字时要在文字的两旁加入单引号或者双引号. 为了使插入的内容美观,可以在选择器中加入添加的内容的样式

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的 CSS3简要教程-html5教程网

Web 设计师可以使用HTML4和CSS2.1完成一些很酷的东西.我们可以在不使用陈旧的基于table布局的基础上完成文档逻辑结构并创建内容丰富的网站.我们可以在不使用内联<font>和<br>标签的基础上对网站添加漂亮而细腻的风格样式.事实上,我们目前的设计能力已经让我们远离了那个可怕的浏览器战争时代.专有协议和那些充满闪动.滚动和闪烁的丑陋网页.虽然我们现在已经普遍使用了HTML4和CSS2.1,但是我们还可以做得更好!我们可以重组我们代码的结构并能让我们的页面代码更富有语义化

使用Selectivizr让你的 CSS3选择器 通吃IE6/7/8

作者:文刀日月 使用Selectivizr让你的 CSS3选择器 通吃IE6/7/8 Selectivizr是一个JS文件,你只需要引入如JQuery.Mootools.Prototype等N多流行的JS框架中的任意一个,然后再调用Selectivizr,就可以让IE6/7/8支持CSS3选择器. 1 2 3 4 5 <!--[if (gte IE 6)&(lte IE 8)]>   <script src="http://code.jquery.com/jquery.