慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

朵小萌

五.渐变色彩 1.CSS3中Gradient 分为线性渐变（linear）和径向渐变（radial）。线性渐变：linear-gradient（to bottom---（等价于180deg）,#fff---（起点）,#999---（终点）） ·渐变方向参数：0deg---to top（），90deg---to right（从左向右），180deg---to bottom（从上向下），270deg---to left（从右向左），to top left（右下角到左上角），to top right（左下角到右上角）。 ·第一个参数省略时，默认为"180deg",等同于"to bottom"。 ·第二和第三个参数，表示起始点和结束点，可以有很多个颜色值。

查看全部

0 采集收起来源：CSS3颜色渐变色彩
2018-03-22
朵小萌

四.颜色之RGBA 1.RGB是一种色彩标准，有红、绿、蓝的变化及相互得加得来的各式各样的颜色。 RGBA是在RGB的基础上增加了控制alpha透明度的参数。语法：color:(R,G,B,A)---A为透明度参数，取值在0~1之间代码：background-color：rgba(255,255,255,0.5);

查看全部

0 采集收起来源：CSS3颜色颜色之RGBA
2016-10-13
朵小萌

三.边框应用图片：border-image 1.background：url(xx.jpg) 10px 20px no-repeat;（repeat-重复；round-平铺；strerch-拉伸）注：Chrome下，中间部分也会被拉伸，webikit浏览器对于round属性和repeat属性似乎没有区分，显示效果是一样的。 Firefox26.0下是可以准确区分的。

查看全部

0 采集收起来源：CSS3边框为边框应用图片 border-image
2016-10-13
朵小萌

二.阴影：box-shadow (二) 1.阴影模糊半径与阴影扩展半径的区别 ·模糊半径：其值只能为正值，如果其值为0，表示阴影不具有模糊效果，其值越大阴影的边缘越模糊。 ·扩展半径：其值可以为正负值，如果值为正，则整个阴影的延展扩大，反之值为负值，则缩小。 2.X轴偏移量与Y轴偏移量可以设置为负数 box-shadow：X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式];

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（二）
2016-10-13
朵小萌

二.阴影：box-shadow 1.box-shadow：X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式] 注：inset可以写在参数的第一个或者最后一个，其他位置是无效的。 2.box-shadow可以添加多个阴影，用逗号隔开

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（一）
2016-10-13
朵小萌

一.圆角效果：border-radius 1.border-radius：10px(所有角都为10px) 2.border-radius:5px 4px 3px 2px(四个角：左上，右上，右下，左下--------顺时针) 3.实心上半圆：方法：把height设为width的一半，并且只设置左上角与右上角的半径与元素高度一致div:{ height:50px; width:100px; bavkground:#000; border-radius:50px 50px 0 0;/*半径至少设置为height的值*/ } 4.实心圆：方法：height与width值为一致。并且四个圆角值都设置为它们值的一半 div{ height:100px; width:100px; background:#000; border-radius:50px; }

查看全部

0 采集收起来源：CSS3边框圆角效果 border-radius
2016-10-13
朵小萌

1.边框背景图：边框应用背景图 2.变形处理：对HTML元素进行旋转、缩放、倾斜、移动 3.多栏布局：仿报纸的多栏结构 4,.媒体查询：针对不同屏幕分辨率，应用不同的样式

查看全部

0 采集收起来源：CSS3能做什么？
2016-10-13
朵小萌

1.圆角：border-radius 2.块阴影与文字阴影： 3.渐变（IE滤镜也能实现）： 4.个性化字体：@font-face定制实现 5.多背景图：一个元素可以添加多层背景图

查看全部

0 采集收起来源：CSS3能做什么？
2016-10-13
露露_0006

text-shadow:X-offset Y-Offset blur color; 文本字体阴影

查看全部

0 采集收起来源：CSS3文字与字体文本阴影text-shadow
2016-10-13
露露_0006

嵌入服务器字体 @font-face { font-family: "MOOC Font"; src: url("http://www.imooc.com/Amaranth-BoldItalic.otf"); } .demo { font-family: "MOOC Font"; }

查看全部

0 采集收起来源：CSS3文字与字体嵌入字体@font-face
2018-03-22
露露_0006

左右为 x 上下为 y 右正下正

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（二）
2016-10-13
露露_0006

box-shadows : ｛x轴 y轴［阴影模糊半径］［阴影扩展半径］［阴影颜色］［投影方式inset］；［nexitem］｝

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（一）
2016-10-13
露露_0006

px em 百分比都可以作为 border－radius 单位

查看全部

0 采集收起来源：CSS3边框圆角效果 border-radius
2016-10-13
元歌

:after是被选元素的后面插入内容。：before是被选元素的后面插入内容。

查看全部

0 采集收起来源：CSS3选择器 ::before和::after
2016-10-12
慕仰5179415

/*使用伪元素制作导航列表项分隔线*/ .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

首页上一页 390 391 392 393 394 395 396 下一页尾页

0/150

提交

取消

开始学习

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

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