慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

Lemon156

前缀浏览器 -webkit chrome\safari -moz firefox -ms IE -o opera

查看全部

0 采集收起来源：什么是CSS3？
2016-04-24
cqdzdml

<li><a href="#bg1">Hipster Fashion Haircut </a></li>-----#bg1<br> <img src="......" alt="" class="bg slideLeft" id="bg1" />-----#bg1<br> #bg1:target{...... }>-----#bg1,作用于id=bg1的img<br> .bg:not(:target)：应用了bg类、但未被选中的img。其中：target代表被选中的img.例如，点击href=“#bg1”时，则:target则代表id="bg1"的img。 URL 带有后面跟有锚名称 #，指向文档内某个具体的元素。这个被链接的元素就是目标元素(target element)。 :target 选择器可用于选取当前活动的目标元素。

查看全部

0 采集收起来源：切换背景图像综合练习题
2018-03-22
cqdzdml

当你定义的CSS中有position属性值为absolute、relative或fixed，用z-index此取值方可生效。<br> 当z-index 值相同时，1.如果两个元素都没有定位发生位置重合现象或者两个都已定位元素且z-index相同发生位置重合现象，那么按文档流顺序，后面的覆盖前面的；2.如果两个元素都没有设置z-index，使用默认值，一个定位一个没有定位，那么定位元素覆盖未定位元素。按第一条，练习中最后显示的是口红那张图片！

查看全部

0 采集收起来源：切换背景图像综合练习题
2018-03-22
cqdzdml

这是class类别选择器的一种简单应用，class="style1 style2"也就是使用style1与style2所有样式的并集，但是需要注意的是：这个是有顺序的，class="style1 style2"首先载入style1里面的样式，然后再载入style2的，如果style1与style2里面有相同的属性，但是他们的值不同，比如：style1里面有color:red;而style2里面有color:green;那么最终的值就是后面的那个color:green;，如果你要使用（<div class="style1"></div>或<div class="style2"></div>）这样的样子，只需把二者里面的内容放到一个里面就行了，顺便注意一下前面说到的问题就行了

查看全部

0 采集收起来源：切换背景图像综合练习题
2018-03-22
weixin_慕设计2425106

布局 ---> display: flex;<br> 方向 ---> flex-direction: row(横)||column(竖);<br> 上下 ---> align-items: flex-start||center||flex-end;<br> 左右 ---> justify-content:设置主轴; align-items:设置副轴倒序 ---> row-reverse

查看全部

0 采集收起来源：CSS3 伸缩布局（二）
2018-03-22
weixin_慕设计2425106

CSS中有一种基础设计模式叫盒模型，盒模型定义了Web页面中的元素中如何来解析。CSS中每一个元素都是一个盒模型，包括html和body标签元素。在盒模型中主要包括width、height、border、background、padding和margin这些属性，而且他们之间的层次关系可以相互影响，来看一张盒模型的3D展示图：

查看全部

0 采集收起来源：CSS3 盒子模型
2016-04-23
weixin_慕设计2425106

column-span主要用来定义一个分列元素中的子元素能跨列多少。column-width、column-count等属性能让一元素分成多列，不管里面元素如何排放顺序，他们都是从左向右的放置内容，但有时我们需要基中一段内容或一个标题不进行分列，也就是横跨所有列，此时column-span就可以轻松实现，此属性的语法如下。

查看全部

0 采集收起来源：CSS3 跨列设置column-span
2016-04-23
weixin_慕设计2425106

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

查看全部

0 采集收起来源：CSS3 列表边框column-rule
2016-04-23
weixin_慕设计2425106

column-gap主要用来设置列与列之间的间距，其语法规则如下： column-gap: normal || <length>

查看全部

0 采集收起来源：CSS3 列间距column-gap
2018-03-22
玛艾露贝莉_赫恩

具体看笔记

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—target
2016-04-23
weixin_慕设计2425106

column-count属性主要用来给元素指定想要的列数和允许的最大列数。其语法规则： column-count：auto | <integer>

查看全部

0 采集收起来源：CSS3 多列布局——column-count
2018-03-22
weixin_慕设计2425106

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

查看全部

0 采集收起来源：CSS3 多列布局——column-width
2018-03-22
weixin_慕设计2425106

为了能在Web页面中方便实现类似报纸、杂志那种多列排版的布局，W3C特意给CSS3增加了一个多列布局模块（CSS Multi Column Layout Module）。它主要应用在文本的多列布局方面，这种布局在报纸和杂志上都使用了几十年了，但要在Web页面上实现这样的效果还是有相当大的难度，庆幸的是，CSS3的多列布局可以轻松实现。接下来咱们一起学习多列布局相关的知识。 columns：column-width（每列宽度）|| column-count(显示几列)

查看全部

0 采集收起来源：CSS3 多列布局——Columns
2016-04-23
weixin_慕设计2425106

animation-fill-mode属性定义在动画开始之前和结束之后发生的操作。主要具有四个属性值：none、forwards、backwords和both。其四个属性值对应效果如下：属性值效果 none 默认值，表示动画将按预期进行和结束，在动画完成其最后一帧时，动画会反转到初始帧处 forwards 表示动画在结束后继续应用最后的关键帧的位置 backwards 会在向元素应用动画样式时迅速应用动画的初始帧 both 元素动画同时具有forwards和backwards效果在默认情况之下，动画不会影响它的关键帧之外的属性，使用animation-fill-mode属性可以修改动画的默认行为。简单的说就是告诉动画在第一关键帧上等待动画开始，或者在动画结束时停在最后一个关键帧上而不回到动画的第一帧上。或者同时具有这两个效果。

查看全部

0 采集收起来源：CSS3中设置动画时间外属性
2016-04-23
weixin_慕设计2425106

animation-play-state属性主要用来控制元素动画的播放状态。参数：其主要有两个值：running和paused。其中running是其默认值，主要作用就是类似于音乐播放器一样，可以通过paused将正在播放的动画停下来，也可以通过running将暂停的动画重新播放，这里的重新播放不一定是从元素动画的开始播放，而是从暂停的那个位置开始播放。另外如果暂停了动画的播放，元素的样式将回到最原始设置状态。

查看全部

0 采集收起来源：CSS3中设置动画的播放状态
2016-04-23

首页上一页 558 559 560 561 562 563 564 下一页尾页

0/150

提交

取消

开始学习

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

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