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

十天精通CSS3

大漠 Web前端工程师
难度初级
时长 5小时 0分
最热 最新
  • 海南椰子树
    继承 根据 CSS，子元素从父元素继承属性。 body { font-family: Verdana, sans-serif; } 根据上面这条规则，站点的 body 元素将使用 Verdana 字体（假如访问者的系统中存在该字体的话）。 如果你不希望 "Verdana, sans-serif" 字体被所有的子元素继承，又该怎么做呢？比方说，你希望段落的字体是 Times。没问题。创建一个针对 p 的特殊规则，这样它就会摆脱父元素的规则： body { font-family: Verdana, sans-serif; } td, ul, ol, ul, li, dl, dt, dd { font-family: Verdana, sans-serif; } p { font-family: Times, "Times New Roman", serif;
    查看全部
    0 采集 收起 来源：什么是CSS3？

    2018-03-22

  • 海南椰子树
    CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。 selector {declaration1; declaration2; ... declarationN } 每条声明由一个属性和一个值组成。 属性（property）是您希望设置的样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开。 selector {property: value} 如果值为若干单词，则要给值加引号： p {font-family: "sans serif";} 选择器的分组 你可以对选择器进行分组，这样，被分组的选择器就可以分享相同的声明。用逗号将需要分组的选择器分开。在下面的例子中，我们对所有的标题元素进行了分组。所有的标题元素都是绿色的。 h1,h2,h3,h4,h5,h6 { color: green; }
    查看全部
    0 采集 收起 来源：什么是CSS3？

    2018-03-22

  • 一淇
    1、添加“::”和添加“:”的区别，就是没区别
    查看全部
    0 采集 收起 来源：CSS3选择器 ::before和::after

    2015-01-31

  • 海南椰子树
    属性选择器 下面的例子为带有 title 属性的所有元素设置样式： [title] { color:red; } 属性和值选择器 下面的例子为 title="W3School" 的所有元素设置样式： [title=W3School] { border:5px solid blue; } 可以只对有指定属性的锚（a 元素）应用样式： a[type=text] {color:red;} 根据部分属性值选择 下面的例子为包含指定值的 title 属性的所有元素设置样式。适用于由空格分隔的属性值： [title~=hello] { color:red; } 特定属性选择类型 *[lang|="en"] {color: red;} 上面这个规则会选择 lang 属性等于 en 或以 en- 开头的所有元素。因此，以下示例标记中的前三个元素将被选中，而不会选择后两个元素： <p lang="en">Hello!</p> <p lang="en-us">Greetings!</p> <p lang="en-au">G'day!</p> <p lang="fr">Bonjour!</p> <p lang="cy-en">Jrooana!</p> 一般来说，[att|="val"] 可以用于任何属性及其值。 假设一个 HTML 文档中有一系列图片，其中每个图片的文件名都形如 figure-1.jpg 和 figure-2.jpg。就可以使用以下选择器匹配所有这些图像： img[src|="figure"] {border: 1px solid gray;} 可以根据多个属性进行选择，只需将属性选择器链接在一起即可。 例如，为了将同时有 href 和 title 属性的 HTML 超链接的文本设置为红色，可以这样写： a[href][title] {color:red;} 部分值属性选择器与点号类名记法的区别 该选择器等价于我们在类选择器中讨论过的点号类名记法。 也就是说，p.important 和 p[class="important"] 应用到 HTML 文档时是等价的。
    查看全部
    0 采集 收起 来源：CSS3选择器 属性选择器

    2018-03-22

  • 海南椰子树
    相邻兄弟选择器（+） 选择相邻兄弟 如果需要选择紧接在另一个元素后的元素，而且二者有相同的父元素，可以使用相邻兄弟选择器（Adjacent sibling selector）。 例如，如果要增加紧接在 h1 元素后出现的段落的上边距，可以这样写： h1 + p {margin-top:50px;} 这个选择器读作：“选择紧接在 h1 元素后出现的段落，h1 和 p 元素拥有共同的父元素”。
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—first-child

    2015-01-31

  • 7shxian
    display:flex; flex-direction:column; justify-content:flex-start;flex-end; align-items:flex-start;flex-end;
    查看全部
    0 采集 收起 来源：CSS3 伸缩布局（一）

    2015-01-31

  • 陳沉
    脚本下载地址： media-queries.js(http://code.google.com/p/css3-mediaqueries-js/) respond.js(https://github.com/scottjehl/Respond) <!—[if lt IE9]> <scriptsrc=http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js></script> ​<![endif]>
    查看全部
    0 采集 收起 来源：Responsive设计——meta标签

    2018-03-22

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

    2018-03-22

  • 魔法师蚂蚱
    这俩半径一般都一样
    查看全部
    0 采集 收起 来源：CSS3边框 阴影 box-shadow（二）

    2015-01-30

  • 陳沉
    来看一个断点解决图片自适应的例子。 <img src="image.jpg" data-src-600px="image-600px.jpg" data-src-800px="image-800px.jpg" alt="" /> 对应的CSS代码： @media (min-device-width:600px){ img[data-src-600px]{ content: attr(data-src-600px,url); } } @media (min-device-width:800px){ img[data-src-800px] { content:attr(data-src-800px,url); } }
    查看全部
    0 采集 收起 来源：Responsive设计（一）

    2018-03-22

  • Lunay
    结构性伪类选择器—first-child “:first-child”选择器表示的是选择父元素的第一个子元素的元素E。简单点理解就是选择元素中的第一个子元素，记住是子元素，而不是后代元素。 示例演示 通过“:first-child”选择器定位列表中的第一个列表项，并将序列号颜色变为红色。 HTML代码： <ol> <li><a href="##">Link1</a></li> <li><a href="##">Link2</a></li> <li><a href="##">link3</a></li> </ol> CSS代码： ol > li{ font-size:20px; font-weight: bold; margin-bottom: 10px; } ol a { font-size: 16px; font-weight: normal; } ol > li:first-child{ color: red; }
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—first-child

    2018-03-22

  • 悟酱起飞
    jquery控制选择器nth-child可以兼容各浏览器，但是对于nth-last-child，不兼容IE系列浏览器，还会报脚本错误。
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—nth-last-child(n)

    2015-01-30

  • Lunay
    结构性伪类选择器—target :target选择器称为目标选择器，用来匹配文档(页面)的url的某个标志符的目标元素。我们先来上个例子，然后再做分析。 示例展示 点击链接显示隐藏的段落。 HTML代码： <h2><a href="#brand">Brand</a></h2> <div class="menuSection" id="brand"> content for Brand </div> CSS代码： .menuSection{ display: none; } :target{/*这里的:target就是指id="brand"的div对象*/ display:block; }
    查看全部
    0 采集 收起 来源：CSS3 结构性伪类选择器—target

    2018-03-22

  • 陳沉
    努力向这水平靠拢
    查看全部
    0 采集 收起 来源：制作3D旋转导航综合练习题

    2015-01-30

  • hahaseki
    第一节 多列布局——Columns 文本的多列布局方面 columns：<column-width> || <column-count> e.g. columns: 150px 3;
    查看全部
    0 采集 收起 来源：CSS3 多列布局——Columns

    2018-03-22

首页上一页1113111411151116111711181119下一页尾页

举报

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

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

查看已购买的课程