慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

Dream0703

nth-last-of-type(n)选择器 “:nth-last-of-type(n)”选择器和“:nth-of-type(n)”选择器是一样的，选择父元素中指定的某种子元素类型，但它的起始方向是从最后一个子元素开始，而且它的使用方法类似于上节中介绍的“:nth-last-child(n)”选择器一样。

查看全部

0 采集收起来源：CSS3 nth-last-of-type(n)选择器
2016-05-21
Dream0703

nth-of-type(n)选择器 “:nth-of-type(n)”选择器和“:nth-child(n)”选择器非常类似，不同的是它只计算父元素中指定的某种类型的子元素。当某个元素中的子元素不单单是同一种类型的子元素时，使用“:nth-of-type(n)”选择器来定位于父元素中某种类型的子元素是非常方便和有用的。在“:nth-of-type(n)”选择器中的“n”和“:nth-child(n)”选择器中的“n”参数也一样，可以是具体的整数，也可以是表达式，还可以是关键词。

查看全部

0 采集收起来源：CSS3 nth-of-type(n)选择器
2016-05-21
Dream0703

first-of-type选择器 “:first-of-type”选择器类似于“:first-child”选择器，不同之处就是指定了元素的类型,其主要用来定位一个父元素下的某个类型的第一个子元素。

查看全部

0 采集收起来源：CSS3 first-of-type选择器
2016-05-21
Dream0703

结构性伪类选择器—nth-last-child(n) “:nth-last-child(n)”选择器和前面的“:nth-child(n)”选择器非常的相似，只是这里多了一个“last”，所起的作用和“:nth-child(n)”选择器有所区别，从某父元素的最后一个子元素开始计算，来选择特定的元素。

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—nth-last-child(n)
2016-05-21
Dream0703

结构性伪类选择器—nth-child(n) “:nth-child(n)”选择器用来定位某个父元素的一个或多个特定的子元素。其中“n”是其参数，而且可以是整数值(1,2,3,4)，也可以是表达式(2n+1、-n+5)和关键词(odd、even)，但参数n的起始值始终是1，而不是0。也就是说，参数n的值为0 or 负数时，选择器将选择不到任何匹配的元素。

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—nth-child(n)
2016-05-21
Dream0703

display:block就是将元素显示为块级元素. block元素的特点是：总是在新行上开始；高度，行高以及顶和底边距都可控制；宽度缺省是它的容器的100%，除非设定一个宽度 <div>, <p>, <h1>, <form>, <ul>和<li>是块元素的例子。 display:inline就是将元素显示为行内元素. inline元素的特点是：和其他元素都在一行上；高，行高及顶和底边距不可改变；宽度就是它的文字或图片的宽度，不可改变。 <span>, <a>, <label>, <input>, <img>, <strong>和<em>是inline元素的例子。 inline和block可以控制一个元素的行宽高等特性，需要切换的情况如下：让一个inline元素从新行开始；让块元素和其他元素保持在一行上；控制inline元素的宽度（对导航条特别有用）；控制inline元素的高度；无须设定宽度即可为一个块元素设定与文字同宽的背景色。 display:inline-block将对象呈递为内联对象，但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内，允许空格。 inline-block的元素特点：将对象呈递为内联对象，但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内，允许空格。(准确地说，应用此特性的元素呈现为内联对象，周围元素保持在同一行，但可以设置宽度和高度地块元素的属性)

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—last-child
2018-03-22
Dream0703

结构性伪类选择器—first-child “:first-child”选择器表示的是选择父元素的第一个子元素的元素E。简单点理解就是选择元素中的第一个子元素，记住是子元素，而不是后代元素。

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—first-child
2016-05-21
Dream0703

结构性伪类选择器—target。重要：通常都是<a>和其他标签组合使用，其余标签的id要和<a>标签href="# id"一样，这样的话，#id：target{}设置的样式是其他标签的，最终效果就是当点击链接是，其余标签的样式会变 :target选择器称为目标选择器，用来匹配文档(页面)的url的某个标志符的目标元素。 #brand:target{/*这里的:target就是指id="brand"的div对象*/ 1、具体来说，触发元素的URL中的标志符通常会包含一个#号，后面带有一个标志符名称，上面代码中是：#brand 2、：target就是用来匹配id为“brand”的元素（id="brand"的元素）,上面代码中是那个div元素。多个url（多个target）处理：就像上面的例子，#brand与后面的id="brand"是对应的，当同一个页面上有很多的url的时候你可以取不同的名字，只要#号后对的名称与id=""中的名称对应就可以了。如下面例子： html代码： <h2><a href="#brand">Brand</a></h2> <div class="menuSection" id="brand"> content for Brand </div> <h2><a href="#jake">Brand</a></h2> <div class="menuSection" id="jake"> content for jake </div> <h2><a href="#aron">Brand</a></h2> <div class="menuSection" id="aron"> content for aron </div> css代码： #brand:target { background: orange; color: #fff; } #jake:target { background: blue; color: #fff; } #aron:target { background: red; color: #fff; } 上面的代码可以对不同的target对象分别设置不的样式。

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—target
2018-03-22
Dream0703

结构性伪类选择器—empty :empty选择器表示的就是空。用来选择没有任何内容的元素，这里没有内容指的是一点内容都没有，哪怕是一个空格。示例显示：比如说，你的文档中有三个段落p元素，你想把没有任何内容的P元素隐藏起来。我们就可以使用“p:empty{}”选择器来控制

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—empty
2016-05-21
Dream0703

结构性伪类选择器—not :not选择器称为否定选择器，和jQuery中的:not选择器一模一样，可以选择除某个元素之外的所有元素。就拿form元素来说，比如说你想给表单中除submit按钮之外的input元素添加红色边框:input:not([type:"submit"]){}

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—not
2018-03-22
Dream0703

结构性伪类选择器—root :root选择器，从字面上我们就可以很清楚的理解是根选择器，他的意思就是匹配元素E所在文档的根元素。在HTML文档中，根元素始终是<html>。 :root{} <===> html{}

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—root
2018-03-22
Dream0703

Element[attr^="val"]{}开头； Element[attr$="val"]{}结尾； Element[attr*="val"]{}所有；

查看全部

0 采集收起来源：CSS3选择器属性选择器
2018-03-22
豆芽快长大

box-shadow: X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式]; 参数介绍：

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（一）
2016-05-21
豆芽快长大

不要以为border-radius的值只能用px单位，你还可以用百分比或者em，但兼容性目前还不太好。

查看全部

0 采集收起来源：CSS3边框圆角效果 border-radius
2016-05-21
豆芽快长大

border-radius: 5px 4px 3px 2px; /* 四个半径值分别是左上角、右上角、右下角和左下角，顺时针 */

查看全部

0 采集收起来源：CSS3边框圆角效果 border-radius
2016-05-21

首页上一页 520 521 522 523 524 525 526 下一页尾页

0/150

提交

取消

开始学习

课程须知: 1.html+CSS相关基础知识 2.具有一定的网页制作经验 3.此课程不支持IE9版本以下，建议使用 chrome、safari、firefox、opera浏览器学习本课程。

老师告诉你能学到什么？: 1.系统学习CSS3相关知识 2.轻松制作出各种绚丽的效果