慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

留言心殇

box-shadow:4px 2px 6px #333333; X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影颜色]

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（一）
2015-10-10
广藿香Patchouli

:last-of-type 选择器，从后面开始选择元素或标签

查看全部

0 采集收起来源：CSS3 last-of-type选择器
2015-10-10
noodleko

实心上半圆：方法：把高度(height)设为宽度（width）的一半，并且只设置左上角和右上角的半径与元素的高度一致（大于也是可以的）。 div{ height:50px;/*是width的一半*/ width:100px; background:#9da; border-radius:50px 50px 0 0;/*半径至少设置为height的值*/ } 实心圆：方法：把宽度（width）与高度(height)值设置为一致（也就是正方形），并且四个圆角值都设置为它们值的一半。如下代码： div{ height:100px;/*与width设置一致*/ width:100px; background:#9da; border-radius:50px;/*四个圆角值都设置为宽度或高度值的一半*/ }

查看全部

0 采集收起来源：CSS3边框圆角效果 border-radius
2015-10-10
各种各种各种

linear-gradient:线性渐变；radial-gradient:径向渐变（参数一，参数二，参数三……）参数一为渐变方向：0deg,90deg,180deg,270deg 或者使用to加方向参数二为起始颜色，三为结束颜色，可以有多个颜色

查看全部

0 采集收起来源：CSS3颜色渐变色彩
2015-10-10
wang1275

@keyframes changecolor{ 0%{ background: red; } 20%{ background:blue; } 40%{ background:orange; } 60%{ background:green; } 80%{ background:yellow; } 100%{ background: red; } } div:hover { animation: changecolor 5s ease-out .2s; }

查看全部

0 采集收起来源：CSS3 Keyframes介绍
2015-10-10
熊球球跳

checked="checked"

查看全部

0 采集收起来源：CSS3选择器 :checked选择器
2018-03-22
wang1275

.wrapper div { background: orange; color: #fff; 元素的原点重置到右上角，然后进行15度的扭曲。 -webkit-transform: skew(15deg,15deg); -moz-transform: skew(15deg,15deg); transform: skew(15deg,15deg); -webkit-transform-origin: top right; -moz-transform-origin: top right; transform-origin: top right; transition:2s; } .wrapper div:hover{ transform:rotate(90deg); }

查看全部

0 采集收起来源：CSS3中的变形--原点 transform-origin
2015-10-10
申芳芳

border-radius的含义是：圆角。 border-radius是一种缩写方法。如果“/”前后的值都存在，那么“/”前面的值设置其水平半径，“/”后面值设置其垂直半径。

查看全部

0 采集收起来源：CSS3选择器 ::before和::after
2015-10-10
wang1275

不知道宽度和高度的元素实现水平、垂直居中。 -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%);

查看全部

0 采集收起来源：CSS3中的变形--位移 translate()
2015-10-10
申芳芳

单冒号(:)用于CSS3伪类，双冒号(::)用于CSS3伪元素

查看全部

0 采集收起来源：CSS3选择器 ::before和::after
2015-10-09
慕运维2603834

: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)选择器
2015-10-09
慕运维2603834

“:first-of-type”选择器类似于“:first-child”选择器，不同之处就是指定了元素的类型,其主要用来定位一个父元素下的某个类型的第一个子元素。 .wrapper > p:first-of-type { background: orange; }在这里p就是定义的元素此种元素的第一种类型

查看全部

0 采集收起来源：CSS3 first-of-type选择器
2018-03-22
忘_风铃

显示文本省略，需在强制文本在一行内显示（white-space:nowrap），溢出的内容隐藏， text-overflow:ellipsis; overflow:hidden; white-space:nowrap:

查看全部

0 采集收起来源：CSS3文字与字体 text-overflow 与 word-wrap
2015-10-09
忘_风铃

text-overflow:clip \ ellipsis 裁剪 \ 省略标记

查看全部

0 采集收起来源：CSS3文字与字体 text-overflow 与 word-wrap
2015-10-09
忘_风铃

box-show 的x 和 y 偏移距离。

查看全部

0 采集收起来源：CSS3边框为边框应用图片 border-image
2015-10-09

首页上一页 741 742 743 744 745 746 747 下一页尾页

0/150

提交

取消

开始学习

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

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