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

十天精通CSS3

大漠 Web前端工程师
难度初级
时长 5小时 0分
  • 变形--位移 translate() translate()函数可以将元素向指定的方向移动,类似于position中的relative。或以简单的理解为,使用translate()函数,可以把元素从原来的位置移动,而不影响在X、Y轴上的任何Web组件。 1、translate(x,y)水平方向和垂直方向同时移动; 2、translateX(x)仅水平方向移动; 3、translateY(Y)仅垂直方向移动
    查看全部
  • 变形--缩放 scale() 缩放 scale()函数 让元素根据中心原点对对象进行缩放。 1、 scale(X,Y)使元素水平方向和垂直方向同时缩放; 2、scaleX(x)元素仅水平方向缩放; 3、scaleY(y)元素仅垂直方向缩放 注意: scale()的取值默认的值为1,当值设置为0.01到0.99之间的任何值,作用使一个元素缩小;而任何大于或等于1.01的值,作用是让元素放大。
    查看全部
  • 变形--扭曲 skew() 扭曲skew()函数能够让元素倾斜显示。它可以将一个对象以其中心位置围绕着X轴和Y轴按照一定的角度倾斜。这与rotate()函数的旋转不同,rotate()函数只是旋转,而不会改变元素的形状。skew()函数不会旋转,而只会改变元素的形状。
    查看全部
  • transition property, duration, time-function, delay
    查看全部
  • 设置元素的起始位置 background-origin : border-box | padding-box | content-box; 参数分别表示背景图片是从边框,还是内边距(默认值),或者是内容区域开始显示
    查看全部
  • text-shadow: X-Offset Y-Offset blur color;
    查看全部
  • translate()函数可以将元素向指定的方向移动,类似于position中的relative。或以简单的理解为,使用translate()函数,可以把元素从原来的位置移动,而不影响在X、Y轴上的任何Web组件。 可以让不知道宽度和高度的元素实现水平、垂直居中。 -webkit-transform: translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%);
    查看全部
  • color:rgba(R,G,B,A)
    查看全部
  • scale()的取值默认的值为1,当值设置为0.01到0.99之间的任何值,作用使一个元素缩小;而任何大于或等于1.01的值,作用是让元素放大。
    查看全部
  • box-shadow: X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式];
    查看全部
  • ::before和::after这两个主要用来给元素的前面或后面插入内容,这两个常和"content"配合使用,使用的场景最多的就是清除浮动。
    查看全部
  • p:nth-child(2n),规定属于其父元素的偶数元素的每个 p 的跨列状态,:nth-child(n) 选择器匹配属于其父元素的第 N 个子元素,不论元素的类型。
    查看全部
  • p:nth-child(2n),规定属于其父元素的偶数元素的每个 p 的跨列状态
    查看全部
  • column-span主要用来定义一个分列元素中的子元素能跨列多少,比如标题横跨所有列。column-span: none | all
    查看全部
  • column-width 宽度 column-count 列数 column-gap主要用来设置列与列之间的间距
    查看全部

举报

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

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