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

十天精通CSS3

大漠 Web前端工程师
难度初级
时长 5小时 0分
最热 最新
  • 努力的开发人员
    响应式设计中的断点值：min-width, max-width
    查看全部
    0 采集 收起 来源：Responsive设计（二）

    2015-06-18

  • hawke
    这个。。。。 需要抄作业了
    查看全部
    0 采集 收起 来源：CSS3背景 制作导航菜单综合练习题

    2015-06-18

  • IHaveADreamD
    颜色之RGBA RGBA是在RGB的基础上增加了控制alpha透明度的参数。 语法： color：rgba(R,G,B,A) 正整数值的取值范围为：0 - 255。百分数值的取值范围为：0.0% - 100.0%。超出范围的数值将被截至其最接近的取值极限。并非所有浏览器都支持使用百分数值。A为透明度参数，取值在0~1之间，不可为负值。
    查看全部
    0 采集 收起 来源：CSS3颜色 颜色之RGBA

    2015-06-18

  • 努力的开发人员
    “:only-child”选择器选择的是父元素中只有一个子元素，而且只有唯一的一个子元素。也就是说，匹配的元素的父元素中仅有一个子元素，而且是一个唯一的子元素。 子元素:only-child { // CSS ... }
    查看全部
    0 采集 收起 来源：CSS3 only-child选择器

    2015-06-18

  • rookie_r
    text-overflow语法： text-overflow:clip|ellipsis 其中，clip:表示剪切，ellipsis:表示显示省略标记
    查看全部
    0 采集 收起 来源：CSS3文字与字体 text-overflow 与 word-wrap

    2015-06-18

  • O序猿o
    <!-- [ if lt IE9 ]> do .... <![endif] -->
    查看全部
    0 采集 收起 来源：Responsive设计——meta标签

    2018-03-22

  • O序猿o
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    查看全部
    0 采集 收起 来源：Responsive设计——meta标签

    2018-03-22

  • hanashin
    【CSS3】【属性选择器】 1.选择class属性以icon『开头』的a a[class^=icon]{ background: green; color:#fff; } 2.选择href属性以pdf『结尾』的a a[href$=pdf]{ background: orange; color: #fff; } 3.选择title属性『包含』more的a a[title*=more]{ background: blue; color: #fff; }
    查看全部
    0 采集 收起 来源：CSS3选择器 属性选择器

    2015-06-17

  • hanashin
    【CSS3】【导航菜单制作练习】 具体点击课程代码查看： .nav{ width:560px; height: 50px; font:bold 0/50px Arial; text-align:center; margin:40px auto 0; background: #f65f57; /*制作圆*/ border-radius:10px; /*制作导航立体风格*/ box-shadow:0px 5px 2px rgba(100,0,0,.6); } /*使用伪元素制作导航列表项分隔线*/ .nav li:before{ content:""; color:#666; position:absolute; top:18px; height:20px; left:-1px; width:1px; background-image:linear-gradient(to bottom,#f65f57,#993333,#f65f57); } /*删除第一项和最后一项导航分隔线*/ .nav li:first-child::before{ background-image:none; }
    查看全部
    0 采集 收起 来源：CSS3背景 制作导航菜单综合练习题

    2018-03-22

  • O序猿o
    Media Queries——媒体类型（一） 随着科学技术不断的向前发展，网页的浏览终端越来越多样化，用户可以通过：宽屏电视、台式电脑、笔记本电脑、平板电脑和智能手机来访问你的网站。尽管你无法保证一个网站在不同屏幕尺寸和不同设备上看起来完全一模一样，但至少要让你的Web页面能适配用户的终端，让他更好的呈现在你的用户面前。在本节中，将会学到如何使用CSS3中的Media Queries模块来让一个页面适应不同的终端（或屏幕尺寸），从而让你的页面让用户有一个更好的体验。 Media Queries Media Queries是CSS3新增加的一个模块功能，其最大的特色就是通过CSS3来查询媒体，然后调用对应的样式。其实这个功能在CSS2.1中就有出现过，只不过那个时候此功能并不强大，我们最常见的就是给打印设备添加打印样式。随着时代的变化，这个模块功能越来越强大。 在彻底的了解Media Queries我们需要了解其中的两个重要部分，第一个是媒体类型，第二个是媒体特性。下面的内容我们简单的来了解这两个部分： 一、媒体类型 媒体类型（Media Type）在CSS2中是一个常见的属性，也是一个非常有用的属性，可以通过媒体类型对不同的设备指定不同的样式。 在CSS2中常碰到的就是all(全部)、screen(屏幕)、print(页面打印或打印预览模式)，其实媒体类型远不止这三种，W3C总共列出了10种媒体类型。如下表所示： 值 设备类型 All 所有设备 Braille 盲人用点字法触觉回馈设备 Embossed 盲文打印机 Handheld 便携设备 Print 打印用纸或打印预览视图 Projection 各种投影设备 Screen 电脑显示器 Speech 语音或音频合成器 Tv 电视机类型设备 Tty 使用固定密度字母栅格的媒介，比如电传打字机和终端 其中Screen、All和Print为最常见的三种媒体类型。
    查看全部
    2 采集 收起 来源：Media Queries——媒体类型（一）

    2015-06-17

  • hanashin
    【CSS3】【多重背景 multiple backgrounds】 多重背景，也就是CSS2里background的属性外加origin、clip和size组成的新background的多次叠加，缩写时为用逗号隔开的每组值；用分解写法时，如果有多个背景图片，而其他属性只有一个（例如background-repeat只有一个），表明所有背景图片应用该属性值。 语法缩写如下： background ： [background-color] | [background-image] | [background-position][/background-size] | [background-repeat] | [background-attachment] | [background-clip] | [background-origin],... 可以把上面的缩写拆解成以下形式： 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 的缩写值； 如果有 size 值，需要紧跟 position 并且用 "/" 隔开； 如果有多个背景图片，而其他属性只有一个（例如 background-repeat 只有一个），表明所有背景图片应用该属性值。 background-color 只能设置一个。
    查看全部
    0 采集 收起 来源：CSS3背景 multiple backgrounds

    2018-03-22

  • hanashin
    【CSS3】【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

  • hanashin
    【CSS3】【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-06-17

  • hanashin
    【CSS3】【background-origin 设置背景图片的原始起始位置】 设置元素背景图片的原始起始位置： 语法：background-origin ： border-box | padding-box | content-box; 参数分别表示背景图片是从『边框』，还是『内边距（默认值）』，或者是『内容区域』开始显示。 『注意：如果背景不是no-repeat，这个属性无效，它会从边框开始显示。』
    查看全部
    0 采集 收起 来源：CSS3背景 background-origin

    2015-06-17

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

    2015-06-17

首页上一页906907908909910911912下一页尾页

举报

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

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

查看已购买的课程