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

十天精通CSS3

大漠 Web前端工程师
难度初级
时长 5小时 0分
最热 最新
  • AGhosts
    :empty选择器表示的就是空。用来选择没有任何内容的元素，这里没有内容指的是一点内容都没有，哪怕是一个空格。
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—empty

    2016-10-25

  • AGhosts
    :not选择器称为否定选择器，可以选择除某个元素之外的所有元素。就拿form元素来说，比如说你想给表单中除submit按钮之外的input元素添加红色边框，CSS代码可以写成： input:not([type="submit"]){ border:1px solid red; }
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—not

    2018-03-22

  • AGhosts
    :root选择器，匹配元素E所在文档的根元素。在HTML文档中，根元素始终是<html>。 建议使用:root方法。 另外在IE９以下还可以借助“:root”实现hack功能。
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—root

    2018-03-22

  • AGhosts
    选择器 E[attr^=val] 属性的值中以val开头的属性 E[attr$=val] 属性的值中以val结尾的属性 E[attr*=val] 属性的值中包含val的属性
    查看全部
    0 采集 收起 来源：CSS3选择器 属性选择器

    2016-10-25

  • AGhosts
    制作导航菜单
    查看全部
    0 采集 收起 来源：CSS3背景 制作导航菜单综合练习题

    2016-10-25

  • sytasxz
    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-last-child(5){ <--倒数第几个也就是从最后一个开始算--> background: orange; }
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—nth-last-child(n)

    2018-03-22

  • sytasxz
    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+1){ background: green; }
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—nth-child(n)

    2018-03-22

  • sytasxz
    :target选择器称为目标选择器，用来匹配文档(页面)的url的某个标志符的目标元素。 html: <div class="menuSection" id="brand"> <--只要#号后对的名称与id=""中的名称对应就可以了--> <h2><a href="#brand">Brand</a></h2> <p>content for Brand</p> </div> css: #brand:target p { background: orange; color: #fff; }
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—target

    2018-03-22

  • sytasxz
    css： div：not（[id="fotter"]）{ background:orange;} html: <body> <div id="header">页头</div> <div id="page">页体</div> <div id="footer">页脚</div> </body>
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—not

    2018-03-22

  • sytasxz
    <style> a[class^=column]{ <--开头含有某元素--> background:red;} a[href$=doc]{ <--结尾含有某元素--> background:green; } a[title*=box]{ <--任意位置含有某元素--> background:blue; } </style> <body> <a href="##" class="columnNews">我的背景想变成红色</a> <a href="##" class="columnVideo">我的背景想变成红色</a> <a href="##" class="columnAboutUs">我的背景想变成红色</a><br/> <a href="1.doc">我的背景想变成绿色</a> <a href="2.doc">我的背景想变成绿色</a><br/> <a href="##" title="this is a box">我的背景想变成蓝色</a> <a href="##" title="box1">我的背景想变成蓝色</a> <a href="##" title="there is two boxs">我的背景想变成蓝色</a> </body>
    查看全部
    0 采集 收起 来源：CSS3选择器 属性选择器

    2018-03-22

  • AGhosts
    multiple backgrounds:多重背景，缩写时为用逗号隔开的每组值. 语法缩写如下： background ： [background-color] [background-image] [background-position][/background-size] [background-repeat] [background-attachment] [background-clip] [background-origin],... 如果有 size 值，需要紧跟 position 并且用 "/" 隔开； 可以把上面的缩写拆解成以下形式： background-image:url1,url2,...,urlN; background-repeat : repeat1,repeat2,...,repeatN; backround-position : position1,position2,...,positionN; background-size : size1,size2,...,sizeN; background-attachment : attachment1,attachment2,...,attachmentN; background-clip : clip1,clip2,...,clipN; background-origin : origin1,origin2,...,originN; background-color : color; 注意：如果有多个背景图片，而其他属性只有一个（例如 background-repeat 只有一个），表明所有背景图片应用该属性值。background-color 只能设置一个
    查看全部
    0 采集 收起 来源：CSS3背景 multiple backgrounds

    2018-03-22

  • 慕粉1420362554
    animation-fill-mode属性定义在动画开始之前和结束之后发生的操作。主要具有四个属性值：none、forwards、backwords和both。 none默认值，表示动画将按预期进行和结束，在动画完成其最后一帧时，动画会反转到初始帧处 forwards表示动画在结束后继续应用最后的关键帧的位置 backwards会在向元素应用动画样式时迅速应用动画的初始帧 both元素动画同时具有forwards和backwards效果 在默认情况之下，动画不会影响它的关键帧之外的属性，使用animation-fill-mode属性可以修改动画的默认行为。简单的说就是告诉动画在第一关键帧上等待动画开始，或者在动画结束时停在最后一个关键帧上而不回到动画的第一帧上。或者同时具有这两个效果。 让动画停在最一帧处。 animation-fill-mode:forwards; backwards会在动画开始前显示动画的第一帧，例如当动画是在页面加载完成后5秒开始，动画是由红色渐变为绿色，而div本来的背景色是黑色。那么设置backwards属性会使得在动画尚未开始的前五秒div显示为红色，而设置none的话，前五秒会div会显示自己的背景色黑色。
    查看全部
    0 采集 收起 来源：CSS3中设置动画时间外属性

    2016-10-25

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

    2018-03-22

  • AGhosts
    background-clip:用来将背景图片做适当的裁剪以适应实际需要。 语法： background-clip ： border-box | padding-box | content-box | no-clip 参数分别表示从边框、或内填充，或者内容区域向外裁剪背景。no-clip表示不裁切，和参数border-box显示同样的效果。background-clip默认值为border-box。
    查看全部
    0 采集 收起 来源：CSS3背景 background-clip

    2016-10-28

  • AGhosts
    background-origin:设置元素背景图片的原始起始位置。 语法： background-origin ： border-box | padding-box | content-box; 参数分别表示背景图片是从边框，还是内边距（默认值），或者是内容区域开始显示。
    查看全部
    0 采集 收起 来源：CSS3背景 background-origin

    2016-10-25

首页上一页377378379380381382383下一页尾页

举报

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

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

查看已购买的课程