为了账号安全,请及时绑定邮箱和手机立即绑定
慕课网数字资源数据库体验端
十天精通CSS3_学习笔记_慕课网
为了账号安全,请及时绑定邮箱和手机立即绑定

十天精通CSS3

大漠 Web前端工程师
难度初级
时长 5小时 0分
  • perspective:透视方式,也就是近大远小的显示方式。 镜头方向只能是平行Z轴向屏幕内,也就是从屏幕正前方向里看。 可以调整镜头与平面位置: a) perspective属性设置镜头到元素平面的距离。所有元素都是放置在z=0的平面上。比如perspective(300px)表示,镜头距离元素表面的位置是300像素。 b) perspective-origin属性规定了镜头在平面上的位置。默认是放在元素的中心。 在chrome中有一个问题,那就是perspective一定要在rotateY(或rotateX)的前面。否则perspective的设置会无效。
    查看全部
  • 设置动画播放次数 animation-iteration-count属性主要用来定义动画的播放次数。 语法规则: animation-iteration-count: infinite | <number> [, infinite | <number>]* 1、其值通常为整数,但也可以使用带有小数的数字,其默认值为1,这意味着动画将从开始到结束只播放一次。 2、如果取值为infinite,动画将会无限次的播放。
    查看全部
  • 设置动画的播放状态 animation-play-state属性主要用来控制元素动画的播放状态。 参数: 其主要有两个值:running和paused。
    查看全部
  • <style> a[class^="column"]{background:red;} a[href$="doc"]{background:green;} a[title*="box"]{background:blue;} </style> ??????????????????????????????????????????????????????????????????????????????
    查看全部
  • 在HTML中,通过各种各样的属性可以给元素增加很多附加的信息。例如,通过id属性可以将不同div元素进行区分。 在CSS2中引入了一些属性选择器,而CSS3在CSS2的基础上对属性选择器进行了扩展,新增了3个属性选择器,使得属性选择器有了通配符的概念,这三个属性选择器与CSS2的属性选择器共同构成了CSS功能强大的属性选择器。
    查看全部
  • “:read-write”选择器刚好与“:read-only”选择器相反,主要用来指定当元素处于非只读状态时的样式。 这些主要是用来设置表单
    查看全部
  • “:read-only”伪类选择器用来指定处于只读状态元素的样式。简单点理解就是,元素中设置了“readonly=’readonly’” 另外resize属性用来设置是否调整元素的大小取值 none: 不允许用户调整元素大小。 both: 用户可以调节元素的宽度和高度。 horizontal: 用户可以调节元素的宽度 vertical: 用户可以调节元素的高度。
    查看全部
  • ::selection选择器主要是用来设置文字选中时的效果,火狐浏览器需要加前缀
    查看全部
  • :checken用来这是按钮选中时的样式,这样比用js 方便多了
    查看全部
  • :enabled和:disabled 主要是针对表单,前者是主要设置表单可用的样式,后者设置表单为disabled=“disabled”不可用时的样式,如果只设置了input[type="text"]代表所有表单都被设置
    查看全部
  • 结构性伪类选择器—empty :empty选择器表示的就是空。用来选择没有任何内容的元素,这里没有内容指的是一点内容都没有,哪怕是一个空格。 示例显示: 比如说,你的文档中有三个段落p元素,你想把没有任何内容的P元素隐藏起来。我们就可以使用“:empty”选择器来控制。 HTML代码: <p>我是一个段落</p> <p> </p> <p></p>​ CSS代码: p{ background: orange; min-height: 30px; } p:empty { display: none; }​
    查看全部
  • 结构性伪类选择器—not :not选择器称为否定选择器,和jQuery中的:not选择器一模一样,可以选择除某个元素之外的所有元素。就拿form元素来说,比如说你想给表单中除submit按钮之外的input元素添加红色边框,CSS代码可以写成: form { width: 200px; margin: 20px auto; } div { margin-bottom: 20px; } input:not([type="submit"]){ border:1px solid red; }
    查看全部
  • 结构性伪类选择器—root :root选择器,从字面上我们就可以很清楚的理解是根选择器,他的意思就是匹配元素E所在文档的根元素。在HTML文档中,根元素始终是<html>。 示例演示: 通过“:root”选择器设置背景颜色 HTML代码: <div>:root选择器的演示</div> CSS代码: :root { background:orange; } 演示结果: “:root”选择器等同于<html>元素,简单点说: :root{background:orange} html {background:orange;} 得到的效果等同。 建议使用:root方法。 另外在IE9以下还可以借助“:root”实现hack功能。
    查看全部
  • 完全参考楼下的笔记
    查看全部
  • “:only-of-type”选择器用来选择一个元素是它的父元素的唯一一个相同类型的子元素。这样说或许不太好理解,换一种说法。“:only-of-type”是表示一个元素他有很多个子元素,而其中只有一种类型的子元素是唯一的,使用“:only-of-type”选择器就可以选中这个元素中的唯一一个类型子元素。
    查看全部

举报

0/150
提交
取消
课程须知
1.html+CSS相关基础知识 2.具有一定的网页制作经验 3.此课程不支持IE9版本以下,建议使用 chrome、safari、firefox、opera浏览器学习本课程。
老师告诉你能学到什么?
1.系统学习CSS3相关知识 2.轻松制作出各种绚丽的效果
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!