慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

qq_moonriver_0

border-image:url('.jpg') 70 repeat

查看全部

0 采集收起来源：CSS3边框为边框应用图片 border-image
2016-06-03
qq_moonriver_0

x 轴和 y轴是右下为整数相反为负数偏移的方向随之改变

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（二）
2016-06-03
qq_moonriver_0

box-shadow 【x y 阴影模糊半径】颜色内阴影 insert 可以添加多个阴影

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（二）
2016-06-03
暴走大熊

设置背景图片的大小： background-size: auto | <长度值> | <百分比> | cover | contain 1、auto：默认值，不改变背景图片的原始高度和宽度； 2、<长度值>：成对出现如200px 50px，将背景图片宽高依次设置为前面两个值，当设置一个值时，将其作为图片宽度值来等比缩放； 3、<百分比>：0％~100％之间的任何值，将背景图片宽高依次设置为所在元素宽高乘以前面百分比得出的数值，当设置一个值时同上； 4、cover：顾名思义为覆盖，即将背景图片等比缩放以填满整个容器； 5、contain：容纳，即将背景图片等比缩放至某一边紧贴容器边缘为止。

查看全部

0 采集收起来源：CSS3背景 background-size
2018-03-22
暴走大熊

用来将背景图片做适当的裁剪以适应实际需要 background-clip ： border-box | padding-box | content-box | no-clip

查看全部

0 采集收起来源：CSS3背景 background-clip
2016-06-03
暴走大熊

设置元素背景图片的原始起始位置 background-origin ： border-box | padding-box | content-box; 参数分别表示背景图片是从边框，还是内边距（默认值），或者是内容区域开始显示。

查看全部

0 采集收起来源：CSS3背景 background-origin
2016-06-03
暴走大熊

文本阴影 text-shadow: X-Offset Y-Offset blur color; X-Offset：表示阴影的水平偏移距离，其值为正值时阴影向右偏移，反之向左偏移； Y-Offset：是指阴影的垂直偏移距离，如果其值是正值时，阴影向下偏移，反之向上偏移； Blur：是指阴影的模糊程度，其值不能是负值，如果值越大，阴影越模糊，反之阴影越清晰，如果不需要阴影模糊可以将Blur值设置为0； Color：是指阴影的颜色，其可以使用rgba色。

查看全部

0 采集收起来源：CSS3文字与字体文本阴影text-shadow
2016-06-04
暴走大熊

设置本地没有的字体： @font-face{ font-family:字体名称； src:字体文件在服务器上的相对或绝对路径（url("")） }

查看全部

0 采集收起来源：CSS3文字与字体嵌入字体@font-face
2018-03-22
暴走大熊

text-overflow:ellipsis;//文字溢出时显示效果->clip: 剪切; ellipsis: 显示省略标记; overflow:hidden;//溢出内容隐藏 white-space:nowrap;//强制文本在一行内显示另外 word-wrap:normal(控制连续文本换行,浏览器默认）/break-word（表示内容将在边界内换行，不常用）

查看全部

0 采集收起来源：CSS3文字与字体 text-overflow 与 word-wrap
2018-03-22
blovetu

区别，在CSS3中的变形，如rotate(),skew(),scale(),translate()，都可以使用矩阵matrix()函数来代替。 matrix(长度缩放，y轴扭曲，x轴扭曲，宽度缩放，x位移，y位移) Matrix()与translate()关系：translate(x,y)对应Matrix(1,0,0,1,x,y); Matrix()与scale()关系：scale(x,y)对应Matrix(x,0,0,y,0,0); Matrix()与rotate()关系：rotate(x)对应Matrix(cos(x),sin(x),-sin(x),cos(x),0,0) Matrix()与skew()关系：skew(x,y)对应Matrix(1,tan(x),tan(y),1,0,0)

查看全部

0 采集收起来源：CSS3中的变形--矩阵 matrix()
2016-06-02
blovetu

translate()位移，可以装饰元素向指定的方向移动。 1.transform: translate(x,y)水平垂直方向同时移动； 2.transform: translateX(x)水平方向移动； 3.transform: translateY(y)垂直方向移动；例：让不知道宽度和高度的元素实现水平、垂直居中 position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); transform: translate(-50%,-50%);

查看全部

0 采集收起来源：CSS3中的变形--位移 translate()
2016-06-02
若水_

多重背景，也就是CSS2里background的属性外加origin、clip和size组成的新background的多次叠加，缩写时为用逗号隔开的每组值；用分解写法时，如果有多个背景图片，而其他属性只有一个（例如background-repeat只有一个），表明所有背景图片应用该属性值。 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 只能设置一个。举例： .demo{ background-image: url(http://img1.sycdn.imooc.com//54cf2365000140e600740095.jpg),url(http://img1.sycdn.imooc.com//54cf238a0001728d00740095.jpg),url(http://img1.sycdn.imooc.com//54cf23b60001fd9700740096.jpg); background-position: left top, 100px 0, 200px 0; background-repeat: no-repeat, no-repeat, no-repeat; }

查看全部

0 采集收起来源：CSS3背景 multiple backgrounds
2018-03-22
blovetu

scale()以元素中心为基点进行缩放。 1.scale(X,Y)使元素水平和垂直方向同时缩放; 2.scaleX(x)使元素水平方向缩放; 3.scaleY(y)使元素垂直方向绽放; 注：缩放值默认为1，0.01-0.99为缩小；1.01以上为放大

查看全部

0 采集收起来源：CSS3中的变形--缩放 scale()
2016-06-01
blovetu

skew()让元素倾斜显示，以元素中心位置绕着X、Y轴按角度倾斜。 1.transform: skew(x,y) 水平垂直方面同时扭曲; 2.transform: skewX(x) 平水方向扭曲; 3.transform: skewY(y) 垂直方向扭曲;例： -webkit-transform: skew(45dge); -moz-transform: skew(45dge); transform: skew(45dge);

查看全部

0 采集收起来源：CSS3中的变形--扭曲 skew()
2016-06-01
人生还有多少个二十年

总结下，CSS3中的三种动画:tranform形变动画/transition缓动动画/animation逐帧动画; tranform: rotate旋转/skew扭曲/scale缩放/translate移动/matrix矩阵变形; transition: property duration timing-function delay; animation: KeyframesName duration timing-function delay iteration-count direction play-state fill-mode;

查看全部

0 采集收起来源：CSS3中设置动画播放时间
2016-06-01

首页上一页 509 510 511 512 513 514 515 下一页尾页

0/150

提交

取消

开始学习

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

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