css3 实现动画效果,怎样使他无限循环动下去?,css有哪三大基本选择器,css3的基本选择器有哪几种?...
css3 实现动画效果,怎样使他无限循环动下去?
一、实现CSS3无限循环动画代码示例。 代码如下: CSS: @-webkit-keyframes gogogo { 0%{ -webkit-transform: rotate(0deg); border:5px solid red; } 50%{ -webkit-transform: rotate(180deg); background:black; border:5px solid yellow; } 100%{ -webkit-transform: rotate(360deg); background:white; border:5px solid red; } } .loading{ border:5px solid black; border-radius:40px; width: 28px; height: 188px; -webkit-animation:gogogo 2s infinite linear ; margin:100px; } 扩展资料实现动画无限循环所需要的CSS属性说明: 1、infinite 在animation后面加上infinite就可以无限循环,另外还可以做反向循环使用animation-direction 2、animation-name 规定需要绑定到选择器的 keyframe 名称。 3、animation-duration 规定完成动画所花费的时间,以秒或毫秒计。 4、animation-timing-function 规定动画的速度曲线。 5、animation-delay 规定在动画开始之前的延迟。 6、animation-iteration-count 规定动画应该播放的次数。 7、animation-direction 规定是否应该轮流反向播放动画。
css有哪三大基本选择器
1、标签选择器 p{color:red;} 什么是标签选择器? 根据指定标签名称,在当前界面中找到所有该名称的标签,并设置属性 注意点: 标签选择器选中的是当前界面所有同名标签,不能单独选中 只要是HTML中的标签都可以作为标签选择器 2、id选择器#id{color:red;} 什么是id选择器? 根据指定标签的id,在当前界面中找到该id的标签,并设置属性 注意点: 每个HTML标签都有id属性 同一个界面中id是唯一的,不能重复 编写id选择器必须要在id前面加上一个#号 id的名称有一定的规范,只能由字母数字和下划线组成 id的名称不能够以数字开头 id的名称不能与HTML标签同名 如果仅仅是为了设置样式,我们不会使用id,因为前段开发中id是留给js使用的 3、类选择器.class{color:red;} 什么是类选择器? 根据指定标签的类,在当前界面中找到该类的标签,并设置属性 注意点 每个HTML标签都有class属性 同一个界面中class属性是可以重复 编写class选择器必须要在class名称前面加上一个.号 class的名称有一定的规范,只能由字母数字和下划线组成 class的名称不能够以数字开头 class的名称不能与HTML标签同名 class就是专门给某一类标签设置样式的 一个标签可以同时绑定多个class属性 Test paragraph,这样就绑定了三个类属性 类选择器实践,通过对不同类的组合来实现不同的效果
css3的基本选择器有哪几种?
1、标签选择器,也称为元素选择器。
标签选择器的基本形式如下:tagName{property:value},其中tagName是标签名称,property是css的属性。
2、类选择器。
类选择器用来为一系列标签定义相同的呈现方式,常用的语法是 .classValue{property:value}。其中classValue是类选择器的名称,这是由css编写者自己命名。(所有浏览器都支持类选择器,但多类选择器(.className1.className2)不被ie6支持。)
3、ID选择器。
ID选择器定义的是某一个特定的html元素,一个网页中只有一个标签或元素使用某一ID的属性值。ID选择器的基本语法格式如下:#idValue{property:value}。其中idValue是ID选择器的名称,可以由CSS编写者自己编写。(所有浏览器都支持)
4、全局选择器。
全局选择器就是对所有的htmlz元素起作用。语法格式为: *{propery:value}。其中“*”表示对所有元素起作用,property表示css的属性,value表示属性值。
5、复合选择器。
将多种选择器进行搭配,可以构成一种复合选择器,也称为组合选择器。
6、继承选择器。
继承的规则是子标签在没有定义的情况下,继承父标签的选择器;当子标签重复定义了父标签的声明时,执行子标签选择器。
7、伪类选择器。
伪类选择器主要应用在标签上,它由四种状态:未访问链接(link)、已访问链接(visited)、激活链接(active)、鼠标停留在连接上(hover)。
下一篇:没有了