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

十天精通CSS3

大漠 Web前端工程师
难度初级
时长 5小时 0分
最热 最新
  • 程显艺
    “:first-of-type”选择器类似于“:first-child”选择器，不同之处就是指定了元素的类型,其主要用来定位一个父元素下的某个类型的第一个子元素。
    查看全部
    0 采集 收起 来源：CSS3 first-of-type选择器

    2015-08-04

  • 程显艺
    “:nth-last-child(n)”选择器和前面的“:nth-child(n)”选择器非常的相似，只是这里多了一个“last”，所起的作用和“:nth-child(n)”选择器有所区别，从某父元素的最后一个子元素开始计算，来选择特定的元素。
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—nth-last-child(n)

    2015-08-04

  • 程显艺
    :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的时候，不选择任何匹配的元素。
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—nth-child(n)

    2015-08-04

  • jiameil
    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

  • 程显艺
    结构性伪类选择器—last-child “:last-child”选择器与“:first-child”选择器作用类似，不同的是“:last-child”选择器选择的是元素的最后一个子元素。
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—last-child

    2015-08-04

  • 程显艺
    结构性伪类选择器“:first-child”选择器表示的是选择父元素的第一个子元素的元素E。简单点理解就是选择元素中的第一个子元素，记住是子元素，而不是后代元素。ol > li:first-child{ color: red; }【选择的是第一个子元素的第一个】
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—first-child

    2018-03-22

  • 程显艺
    点击链接显示隐藏的段落 :target 选择器称为目标选择器，用来匹配文档(页面)的url的某个标志符的目标元素 1、具体来说，触发元素的URL中的标志符通常会包含一个#号，后面带有一个标志符名称，上面代码中是：#brand 2、：target就是用来匹配id为“brand”的元素（id="brand"的元素）,上面代码中是那个div元素。 多个url（多个target）处理： 就像上面的例子，#brand与后面的id="brand"是对应的，当同一个页面上有很多的url的时候你可以取不同的名字，只要#号后对的名称与id=""中的名称对应就可以了。 #brand:target { background: orange; color: #fff; }
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—target

    2018-03-22

  • 程显艺
    ^=x匹配类或者属性值开头为x的元素； $=x匹配结尾为x的元素； *=x匹配属性值任意位置含有x一致的字母
    查看全部
    0 采集 收起 来源：CSS3选择器 属性选择器

    2015-08-03

  • 用户1108516
    FDC
    查看全部
    0 采集 收起 来源：CSS3 列表边框column-rule

    2015-08-03

  • Wendy_22
    在Web中插入内容，在CSS2.1时代依靠的是JavaScript来实现。但进入CSS3进代之后我们可以通过CSS3的伪类“:before”，“:after”和CSS3的伪元素“::before”、“::after”来实现，其关键是依靠CSS3中的“content”属性来实现。不过这个属性对于img和input元素不起作用。 content配合CSS的伪类或者伪元素，一般可以做以下四件事情： 功能 功能说明 none 不生成任何内容 attr 插入标签属性值 url 使用指定的绝对或相对地址插入一个外部资源（图像，声频，视频或浏览器支持的其他任何资源） string 插入字符串 实例展示： 在CSS中有一种清除浮动的方法叫“clearfix”。而这个“clearfix”方法就中就使用了“content”，只不过只是在这里插入了一个空格。如下所示： .clearfix:before, .clearfix:after { content:””; display:table; } .clearfix:after { clear:both; overflow:hidden; } 上面这个示例是最常见的，也是最简单的，我们再来看一个插入元素属性值的方法。 假设我们有一个元素： <a href="##" title="我是一个title属性值，我插在你的后面">我是元素</a> 可以通过”:after”和”content:attr(title)”将元素的”title”值插入到元素内容“我是元素”之后： a:after { content:attr(title); color:#f00; }
    查看全部
    0 采集 收起 来源：CSS生成内容

    2018-03-22

  • Wendy_22
    外轮廓outline在页面中呈现的效果和边框border呈现的效果极其相似，但和元素边框border完全不同，外轮廓线不占用网页布局空间，不一定是矩形，外轮廓是属于一种动态样式，只有元素获取到焦点或者被激活时呈现。 outline属性早在CSS2中就出现了，主要是用来在元素周围绘制一条轮廓线，可以起到突出元素的作用。但是并未得到各主流浏览器的广泛支持，在CSS3中对outline作了一定的扩展，在以前的基础上增加新特性。outline属性的基本语法如下： outline: ［outline-color］ || [outline-style] || [outline-width] || [outline-offset] || inherit 从语法中可以看出outline和border边框属性的使用方法极其类似。outline-color相当于border-color、outline-style相当于border-style，而outline-width相当于border-width，只不过CSS3给outline属性增加了一个outline-offset属性，其取值说明如下。 属性值 属性值说明 outline-color 定义轮廓线的颜色，属性值为CSS中定义的颜色值。在实际应用中，可以将此参数省略，省略时此参数的默认值为黑色。 outline-style 定义轮廓线的样式，属性为CSS中定义线的样式。在实际应用中，可以将此参数省略，省略时此参数的默认值为none，省略后不对该轮廓线进行任何绘制。 outline-width 定义轮廓线的宽度，属性值可以为一个宽度值。在实际应用中，可以将此参数省略，省略时此参数的默认值为medium，表示绘制中等宽度的轮廓线。 outline-offset 定义轮廓边框的偏移位置的数值，此值可以取负数值。当此参数的值为正数值，表示轮廓边框向外偏离多少个像素；当此参数的值为负数值，表示轮廓边框向内偏移多少个像素。 inherit 元素继承父元素的outline效果。
    查看全部
    0 采集 收起 来源：CSS3外轮廓属性

    2015-08-02

  • Wendy_22
    resize属性主要是用来改变元素尺寸大小的，其主要目的是增强用户体验。但使用方法却是极其的简单，先从其语法入手。 resize: none | both | horizontal | vertical | inherit 取值说明： 属性值 取值说明 none 用户不能拖动元素修改尺寸大小。 both 用户可以拖动元素，同时修改元素的宽度和高度 horizontal 用户可以拖动元素，仅可以修改元素的宽度，但不能修改元素的高度。 vertical 用户可以拖动元素，仅可以修改元素的高度，但不能修改元素的宽度。 inherit 继承父元素的resize属性值。 例如：通过resize属性，让文本域可以沿水平方向拖大。代码为： textarea { -webkit-resize: horizontal; -moz-resize: horizontal; -o-resize: horizontal; -ms-resize: horizontal; resize: horizontal; }
    查看全部
    0 采集 收起 来源：自由缩放属性resize

    2015-08-02

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

    2015-08-02

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

    2015-08-02

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

    2015-08-02

首页上一页836837838839840841842下一页尾页

举报

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

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

查看已购买的课程