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

十天精通CSS3

大漠 Web前端工程师
难度初级
时长 5小时 0分
  • transition-delay:指定一个动画开始执行的时间 a{ transition:background 0.8s esse-in 0.3,color 0.6s ease-out0.3; }
    查看全部
  • top: 50%; left:50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); -webkit-transition: all 1s; transition: all 1s; 居中
    查看全部
  • @media 媒体类型 and (媒体特性){样式} @media screen and (min-width){ .asd{ color:red; } }
    查看全部
  • @media screen
    查看全部
  • background-clip 用来将背景图片做适当的裁剪以适应实际需要。 语法: background-clip : border-box padding-box content-box no-clip 参数分别表示从边框、或内填充,或者内容区域向外裁剪背景。no-clip表示不裁切,和参数border-box显示同样的效果。backgroud-clip默认值为border-box。
    查看全部
  • 设置元素背景图片的原始起始位置。 语法: background-origin : border-box padding-box content-box; 参数分别表示背景图片是从边框,还是内边距(默认值),或者是内容区域开始显示。
    查看全部
  • 这个检查是否正确的到底什么鬼?
    查看全部
    0 采集 收起 来源:CSS3中调用动画

    2016-08-03

  • 加上transition看起来自然点
    查看全部
  • 盒子模型。内盒 外盒??
    查看全部
    0 采集 收起 来源:CSS3 盒子模型

    2016-08-03

  • 列间距: column-gap
    查看全部
  • 分栏显示文字 columns : 栏宽 栏数
    查看全部
  • 3D的那部分在哪里???
    查看全部
  • :enabled选择器 在Web的表单中,有些表单元素有可用(“:enabled”)和不可用(“:disabled”)状态,比如输入框,密码框,复选框等。在默认情况之下,这些表单元素都处在可用状态。那么我们可以通过伪选择器“:enabled”对这些表单元素设置样式。 示例演示 通过“:enabled”选择器,修改文本输入框的边框为2像素的红色边框,并设置它的背景为灰色。 HTML代码: <form action="#"> <div> <label for="name">Text Input:</label> <input type="text" name="name" id="name" placeholder="可用输入框" /> </div> <div> <label for="name">Text Input:</label> <input type="text" name="name" id="name" placeholder="禁用输入框" disabled="disabled" /> </div> </form> CSS代码: div{ margin: 20px; } input[type="text"]:enabled { background: #ccc; border: 2px solid red;
    查看全部
  • 结构性伪类选择器—nth-child(n) “:nth-child(n)”选择器用来定位某个父元素的一个或多个特定的子元素。其中“n”是其参数,而且可以是整数值(1,2,3,4),也可以是表达式(2n+1、-n+5)和关键词(odd、even),但参数n的起始值始终是1,而不是0。也就是说,参数n的值为0时,选择器将选择不到任何匹配的元素。 经验与技巧:当“:nth-child(n)”选择器中的n为一个表达式时,其中n是从0开始计算,当表达式的值为0或小于0的时候,不选择任何匹配的元素。如下表所示: 案例演示 通过“:nth-child(n)”选择器,并且参数使用表达式“2n”,将偶数行列表背景色设置为橙色。 HTML代码: <ol> <li>item1</li> <li>item2</li> <li>item3</li> <li>item4</li> <li>item5</li> <li>item6</li> <li>item7</li> <li>item8</li> <li>item9</li> <li>item10</li> </ol>​ CSS代码: ol > li:nth-child(2n){ background: orange; } 演示结果:
    查看全部
  • animation-paly-state 控制动画的暂停和运行
    查看全部

举报

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

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