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

十天精通CSS3

大漠 Web前端工程师
难度初级
时长 5小时 0分
最热 最新
  • Flicker
    代码示例： background-color:rgba(100,120,60,0.5);
    查看全部
    0 采集 收起 来源：CSS3颜色 颜色之RGBA

    2015-04-30

  • Flicker
    Round 参数：Round可以理解为圆满的铺满。为了实现圆满所以会压缩（或拉伸）
    查看全部
    0 采集 收起 来源：CSS3边框 为边框应用图片 border-image

    2015-04-30

  • Flicker
    Round 参数：Round可以理解为圆满的铺满。为了实现圆满所以会压缩（或拉伸）
    查看全部
    0 采集 收起 来源：CSS3边框 为边框应用图片 border-image

    2015-04-30

  • WYDWYD008
    background-size: auto | <长度值> | <百分比> | cover | contain 1、auto：默认值，不改变背景图片的原始高度和宽度； 2、<长度值>：成对出现如200px 50px，将背景图片宽高依次设置为前面两个值，当设置一个值时，将其作为图片宽度值来等比缩放； 3、<百分比>：0％~100％之间的任何值，将背景图片宽高依次设置为所在元素宽高乘以前面百分比得出的数值，当设置一个值时同上； 4、cover：顾名思义为覆盖，即将背景图片等比缩放以填满整个容器,不会顾及等比缩放； 5、contain：容纳，即将背景图片等比缩放至某一边紧贴容器边缘为止，不会填满整个容器。
    查看全部
    0 采集 收起 来源：CSS3背景 background-size

    2018-03-22

  • WYDWYD008
    background-clip ： border-box | padding-box | content-box | no-clip 和上一节的位置差不多，只是这个是剪裁，上一节的background-origin是背景图从哪里显示，这个是背景图就是从边框开始显示的，但是如果选择了后面两个属性那么会从相应位置显示，剪裁后的背景图 同样只有背景图的为no-repeat才有用
    查看全部
    0 采集 收起 来源：CSS3背景 background-clip

    2015-04-29

  • WYDWYD008
    设置背景图片的位置：第一个：从边框开始严实，第二个：从padding开始显示（默认），第三个：从内容开始显示 background-origin ： border-box | padding-box | content-box; 注意：只有背景图片属性是no-repeat改属性才能生效，如果是其他几种的话就根本不存在从哪里开始显示了
    查看全部
    0 采集 收起 来源：CSS3背景 background-origin

    2015-04-29

  • WYDWYD008
    text-shadow可以用来设置文本的阴影效果。 X-Offset：表示阴影的水平偏移距离，其值为正值时阴影向右偏移，反之向左偏移； Y-Offset：是指阴影的垂直偏移距离，如果其值是正值时，阴影向下偏移，反之向上偏移； Blur：是指阴影的模糊程度，其值不能是负值，如果值越大，阴影越模糊，反之阴影越清晰，如果不需要阴影模糊可以将Blur值设置为0； Color：是指阴影的颜色，其可以使用rgba色。
    查看全部
    0 采集 收起 来源：CSS3文字与字体 文本阴影text-shadow

    2015-04-29

  • WYDWYD008
    如果想用特殊字体，并让所有用户看到就向下面这样申明一下 @font-face{/*申明必须的写的*/ font-family: "MOOC Font";/*字体名字*/ src: url("http://www.imooc.com/Amaranth-BoldItalic.otf");/特殊字体在服务器上的位置，当然必须要上传到相应位置*/ }
    查看全部
    0 采集 收起 来源：CSS3文字与字体 嵌入字体@font-face

    2018-03-22

  • WYDWYD008
    只能在一排显示的文字才能这样显示： 1. white-space:nowrap; 将文字控制在父元素的一排显示,该属性还有另外一个值:normal控制连续文本换行，也就是换行显示，这个是默认值 2.将一行显示的文字溢出父元素的部分隐藏overflow:hidden; 3.最后才能用text-overflow:ellipsis; 表示用省略号替换原来的内容，改属性还有另一个默认值clip就是不显示省略号
    查看全部
    0 采集 收起 来源：CSS3文字与字体 text-overflow 与 word-wrap

    2015-04-29

  • WYDWYD008
    linear-gradient线性渐变 background:linear-gradient(to top left,#f00,#000,green); 第一个参数是位置，从哪里渐变到哪里，后面的参数是渐变的颜色，可以有N个颜色但至少指定2个，不然就没意义了 注意那个位置指的是终点，上例中是to top left 到左上角，那么就是从右下角到左上角进行渐变
    查看全部
    0 采集 收起 来源：CSS3颜色 渐变色彩 

    2015-05-04

  • WYDWYD008
    color：rgba(R,G,B,A)RGB就不说了，A就是透明度，取值在0~1之间，不可为负值
    查看全部
    0 采集 收起 来源：CSS3颜色 颜色之RGBA

    2015-04-29

  • 小呵呵
    位置移动transform: translate(50px,100px); x/y translateX()和translateY()可以单独设置 transform: translate(50px,0);等同于transform: translate(50px); 3D transform:translate3d(0,10px,0) z轴不太管用？？？？？？？？？？？
    查看全部
    0 采集 收起 来源：CSS3中的变形--位移 translate()

    2015-05-04

  • 小呵呵
    缩放transform: scale(1.5,0.5); x/y 默认值为1，比1小的即缩小，比1大的即放大,允许有小数，小数点后可以有两位 transform: scale(1.5)等同于transform: scale(1.5,1.5) scaleX()和scaleY()用于单独设置 3D scale3d(0,0,1) xy轴缩放为0，图片不显示 z轴不管事？？？？？？？？？？？？？？？
    查看全部
    1 采集 收起 来源：CSS3中的变形--缩放 scale()

    2015-05-04

  • 小呵呵
    扭曲transform:skew(45deg,0) x/y 可简写为transform:skew(45deg) skewX()和skewY()用于单独设置 单设置x或y的话，比较适合做平行四边形 一般div设置了扭曲，里面的文字也会扭曲，反着设回来就好了 无3d效果
    查看全部
    0 采集 收起 来源：CSS3中的变形--扭曲 skew()

    2015-05-04

  • 小呵呵
    二维空间的旋转-元素相对原点进行旋转，原点在元素的正中心 transform: rotate(45deg);顺时针旋转45度 transform: rotate(-45deg);逆时针旋转45度 一般div旋转了，里面的文字也会旋转，反着设回去就行了 .wrapper div{transform:rotate(-20deg);} .wrapper div span {transform:rotate(20deg);} 3D旋转 transform:rotate3d(1,1,1,45deg) xyz：如果为0则此轴上不进行旋转，值为0-1之间的数，可以为小数，小数点后可以有两位 transform:translate3d(0,10px,0)这种写法会开启移动端的硬件加速，而translateY(10px)不会开启硬件加速
    查看全部
    0 采集 收起 来源：CSS3变形--旋转 rotate()

    2015-05-02

首页上一页972973974975976977978下一页尾页

举报

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

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

查看已购买的课程