慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

慕工程2957023

http://www.cnblogs.com/mumble/p/4576489.html，hack方法合集

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—root
2016-11-17
Yann丶233

box-sizing:content-box，按W3C的盒子模型计算，内容+内边距+边框=元素大小这是搭积木，三块积木搭出一个房子，任何一块积木大小变化了，房子结构就不稳定了，表现为把元素撑大 box-sizing:border-box，按传统IE盒子模型计算，元素大小=内容+内边距+边框这是盖房子，事先定好尺寸，盖好一个房子，里边放三块积木，随便你们三个怎么变化，只要不超过房子的大小，随你们折腾

查看全部

0 采集收起来源：CSS3 盒子模型
2016-11-17
Yann丶233

ease 规定慢速开始，然后变快，然后慢速结束的过渡效果（cubic-bezier(0.25,0.1,0.25,1)）。 ease-in 规定以慢速开始的过渡效果（等于 cubic-bezier(0.42,0,1,1)）。 ease-out 规定以慢速结束的过渡效果（等于 cubic-bezier(0,0,0.58,1)）。 ease-in-out 规定以慢速开始和结束的过渡效果（等于 cubic-bezier(0.42,0,0.58,1)）。特别注意：当transition-property属性设置为all时，表示的是所有中点值的属性。列如：初始状态设置了样式：width/height/background，当你在终始状态都改变了这三个属性，那么all代表的就是width/height/background，如果终始状态只改变了background,那么all代表的就是background.

查看全部

0 采集收起来源：CSS3中的动画--过渡属性 transition-property
2016-11-16
慕工程2957023

1.结构性伪类选择器—root: :root选择器，从字面上我们就可以很清楚的理解是根选择器，他的意思就是匹配元素E所在文档的根元素。在HTML文档中，根元素始终是<html>。 2.示例演示：通过“:root”选择器设置背景颜色 HTML代码： <div>:root选择器的演示</div> CSS代码： :root { background:orange; } “:root”选择器等同于<html>元素，简单点说： :root{background:orange} html {background:orange;} 得到的效果等同。建议使用:root方法。另外在IE９以下还可以借助“:root”实现hack功能。

查看全部

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

css属性选择权 E[alt^=val] 选择匹配元素E，并且E元素定义了属性alt，其属性数值与val相关 ^为val开头 $为val结束 *为包含val <a href="xxx.pdf">我链接的是PDF文件</a> <a href="#" class="icon">我类名是icon</a> <a href="#" title="我的title是more">我的title是more</a> a[class^=icon]{ background: green; color:#fff; } a[href$=pdf]{ background: orange; color: #fff; } a[title*=more]{ background: blue; color: #fff; }

查看全部

0 采集收起来源：CSS3选择器属性选择器
2018-03-22
学志耀博

ease 规定慢速开始，然后变快，然后慢速结束的过渡效果（cubic-bezier(0.25,0.1,0.25,1)）。 ease-in 规定以慢速开始的过渡效果（等于 cubic-bezier(0.42,0,1,1)）。 ease-out 规定以慢速结束的过渡效果（等于 cubic-bezier(0,0,0.58,1)）。 ease-in-out 规定以慢速开始和结束的过渡效果（等于 cubic-bezier(0.42,0,0.58,1)）。

查看全部

0 采集收起来源：CSS3中的动画--过渡属性 transition-property
2016-11-16
慕工程2957023

/*使用伪元素制作导航列表项分隔线*/ li:after { content:'|'; position: absolute; right: 0; } /*删除第一项和最后一项导航分隔线*/ li:last-child:after { display:none; }

查看全部

1 采集收起来源：CSS3背景制作导航菜单综合练习题
2016-11-16
学志耀博

a为元素的水平伸缩量，1为原始大小； b为纵向扭曲，0为不变； c为横向扭曲，0不变； d为垂直伸缩量，1为原始大小； e为水平偏移量，0是初始位置； f为垂直偏移量，0是初始位置

查看全部

0 采集收起来源：CSS3中的变形--矩阵 matrix()
2016-11-16
慕工程2957023

伪类选择器 li:first-child{样式} /*ul中第一个li元素样式*/ li:last-child{样式} /*ul中第一个最后元素样式*/ li:nth-child（n）{样式} /*ul中从上到下第n个li元素样式*/ li:nth-last-child（n）{样式} /*ul中从下到上第n个li元素样式（加上（last就是倒叙））*/ li:nth-child（even）{样式} /*ul中从上到下第2·4·6个（序列为偶数）li元素样式*/ li:nth-child（odd）{样式} /*ul中从上到下第1·3·5个（序列为奇数）li元素样式*/

查看全部

0 采集收起来源：CSS3背景制作导航菜单综合练习题
2016-11-16
慕工程2957023

正确答案： /*1.制作圆角*/ border-radius:10px; /*2.制作导航立体风格*/ box-shadow:0 5px #b64b41; /*3.制作导航分隔线*/ .nav li{background:linear-gradient(to bottom,#dd2926,#a82724,#dd2926) no-repeat right / 1px 15px;} /*4.删除第一个和最后一个导航分隔线*/ .nav li:last-child{background:none;}

查看全部

0 采集收起来源：CSS3背景制作导航菜单综合练习题
2016-11-16
Panda_Q

transition: property duration timing-function delay;

查看全部

0 采集收起来源：CSS3中的动画--过渡延迟时间 transition-delay
2016-11-16
慕工程2957023

多重背景例如： background:url(http://static.mukewang.com/static/img/logo_index.png) no-repeat 0 0 / 75% 50%, url(http://static.mukewang.com/static/img/logo_index.png) no-repeat 150px 80px / 50% 45%; background ： [background-color] | [background-image] | [background-position][/background-size] | [background-repeat] | [background-attachment] | [background-clip] | [background-origin],... 1.用逗号隔开每组 background 的缩写值； 2.如果有 size 值，需要紧跟 position 并且用 "/" 隔开； 3.如果有多个背景图片，而其他属性只有一个（例如 background-repeat 只有一个），表明所有背景图片应用该属性值。 4.background-color 只能设置一个。 background:url(http://static.mukewang.com/static/img/logo_index.png), url(http://static.mukewang.com/static/img/logo_index.png); background-repeat:no-repeat; background-position:left,right; background-size:40%;/*cover contain px %*/ background-attachment:scroll;/*fixed:图片固定*/ background-clip:content-box;/*padding-box border-box*/ background-origin:content-box; background-color:red;

查看全部

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

1、 border-radius是一种缩写方法.如果“/”前后的值都存在,那么“/”前面的值设置其水平半径,“/”后面值设置其垂直半径.

查看全部

0 采集收起来源：CSS3选择器 ::before和::after
2016-11-16
慕工程2957023

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

查看全部

0 采集收起来源：CSS3背景 background-size
2018-03-22
慕工程2957023

ackground-clip：该属性指定了背景在哪些区域可以显示，但与背景开始绘制的位置无关，背景的绘制的位置可以出现在不显示背景的区域，这时就相当于背景图片被不显示背景的区域裁剪了一部分一样。 background-origin：该属性指定了背景从哪个区域(边框、补白或内容)开始绘制,但也仅仅能控制背景开始绘制的位置，你可以用这个属性在边框上绘制背景，但边框上的背景显不显示出来那就要由background-clip来决定了

查看全部

0 采集收起来源：CSS3背景 background-clip
2016-11-16

首页上一页 361 362 363 364 365 366 367 下一页尾页

0/150

提交

取消

开始学习

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

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