慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

慕工程2957023

应用：在自适应布局当中，在元素基础上添加内距padding，按照标准盒模型解析，往往会将布局撑破，但使用box-sizing的border-box值，可以让你轻松完成

查看全部

0 采集收起来源：CSS3 盒子模型
2016-11-24
慕工程2957023

在CSS3中新增加了box-sizing属性，能够事先定义盒模型的尺寸解析方式，其语法规则如下： box-sizing: content-box | border-box | inherit 取值说明属性值属性值说明 content-box后设置的width仅为元素内容的宽度；默认值，其让元素维持W3C的标准盒模型 border-box后设置的width为元素内容宽度+padding+border；重新定义CSS2.1中盒模型组成的模式，让元素维持IE传统的盒模型（IE6以下版本和IE6-7怪异模式），也就是说元素的宽度或高度等于元素内容的宽度或高度。从上面盒模型介绍可知，这里的内容宽度或高度包含了元素的border、padding、内容的宽度或高度（此处的内容宽度或高度＝盒子的宽度或高度—边框—内距）。

查看全部

0 采集收起来源：CSS3 盒子模型
2016-11-24
慕工程2957023

Internet Explorer 10 和 Opera 支持 column-span 属性。 Safari 和 Chrome 支持替代的 -webkit-column-span 属性。火狐不支持该属性

查看全部

0 采集收起来源：CSS3 跨列设置column-span
2016-11-24
慕工程2957023

跨列设置column-span column-span主要用来定义一个分列元素中的子元素能跨列多少。column-width、column-count等属性能让一元素分成多列，不管里面元素如何排放顺序，他们都是从左向右的放置内容，但有时我们需要基中一段内容或一个标题不进行分列，也就是横跨所有列，此时column-span就可以轻松实现，此属性的语法如下。 column-span: none | all 取值说明属性值属性值说明 none 此值为column-span的默认值，表示不跨越任何列。 all 这个值跟none值刚好相反，表示的是元素跨越所有列，并定位在列的Ｚ轴之上。

查看全部

0 采集收起来源：CSS3 跨列设置column-span
2016-11-24
慕工程2957023

column-rule主要是用来定义列与列之间的边框宽度、边框样式和边框颜色。简单点说，就有点类似于常用的border属性。但column-rule是不占用任何空间位置的，在列与列之间改变其宽度不会改变任何列的位置。语法规则： column-rule:<column-rule-width>|<column-rule-style>|<column-rule-color>

查看全部

0 采集收起来源：CSS3 列表边框column-rule
2018-03-22
花开荼蘼0803

background-clip:border-box|padding-box|content-box|no-clip表示从边框，内填充，内容区域向外裁剪背景，no-clip表示不裁剪，和参数border-box显示同样的效果，默认值是border-box

查看全部

0 采集收起来源：CSS3背景 background-clip
2016-11-24
花开荼蘼0803

background-origin:border-box|padding-box|content-box 注意：如果背景不是no-repeat ,属性无效，它会从边框开始显示。参数是表示背景图片是从边框，还是内边距（默认值）,还是内容区域开始

查看全部

0 采集收起来源：CSS3背景 background-origin
2016-11-24
慕工程2957023

列间距column-gap: normal || <length> normal 默值为1em（如果你的字号是px，其默认值为你的font-size值） <length> 设置列与列之间的距离，其可以使用px,em单位的任何整数值，不能是负值。

查看全部

0 采集收起来源：CSS3 列间距column-gap
2018-03-22
慕工程2957023

多列布局的column-count主要是给元素指定想要的列数和允许的最大列数。 column-count：auto | <integer> 不要忘记浏览器的前缀。

查看全部

0 采集收起来源：CSS3 多列布局——column-count
2018-03-22
慕工程2957023

多列布局——column-width column-width的使用和CSS中的width属性一样，不过不同的是，column-width属性在定义元素列宽的时候，既可以单独使用，也可以和多列属性中其他属性配合使用。其基本语法如下所示； column-width: auto | <length>

查看全部

0 采集收起来源：CSS3 多列布局——column-width
2018-03-22
慕工程2957023

多列布局columns属性参数主要就两个属性参数：列宽和列数。举例：要显示2栏显示，每栏宽度为200px，代码为： columns: 200px 2; 语法： columns：<column-width> || <column-count> 参数说明： <column-width>主要用来定义多列中每列的宽度 <column-count>主要用来定义多列中的列数

查看全部

0 采集收起来源：CSS3 多列布局——Columns
2018-03-22
慕工程2957023

perspective:浏览器支持目前浏览器都不支持 perspective 属性。 Chrome 和 Safari 支持替代的 -webkit-perspective 属性。定义和用法 perspective 属性定义 3D 元素距视图的距离，以像素计。该属性允许您改变 3D 元素查看 3D 元素的视图。当为元素定义 perspective 属性时，其子元素会获得透视效果，而不是元素本身。注释：perspective 属性只影响 3D 转换元素。 http://www.htmleaf.com/ziliaoku/qianduanjiaocheng/201502011313.html http://www.htmleaf.com/pins/1412/201502012157/perspective-03.html http://www.zhangxinxu.com/study/201001/css3-animate-3d-effect-demo.html

查看全部

0 采集收起来源：制作3D旋转导航综合练习题
2016-11-23
一个挖煤的人

属性值效果 none 默认值，表示动画将按预期进行和结束，在动画完成其最后一帧时，动画会反转到初始帧处 forwards 表示动画在结束后继续应用最后的关键帧的位置 backwards 会在向元素应用动画样式时迅速应用动画的初始帧 both 元素动画同时具有forwards和backwards效果

查看全部

0 采集收起来源：CSS3中设置动画时间外属性
2016-11-23
一个挖煤的人

总结下，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-11-23
一个挖煤的人

transition: property duration timing-function delay;咳咳，这个语法要记一下。

查看全部

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

首页上一页 355 356 357 358 359 360 361 下一页尾页

0/150

提交

取消

开始学习

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

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