CSS 文章链接、摘要和实践

文本溢出显示为省略号

Ellipsis for text overflow in table cell?

 

变形、过渡和动画

css3中的变形（transform）、过渡(transtion)、动画(animation)

css3中的变形（transform）、过渡(transtion)、动画(animation)

 

摘要：

变形：

transform : rotate | scale | skew | translate | matrix ; (旋转、缩放、扭曲、平移、矩阵变换)

 

过渡 transition，允许css的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击、获得焦点、被点击或对元素任何改变中触发，并圆滑地以动画效果改变CSS的属性值。

实践：

.f-img { transform: scale(1.05) rotate(90deg); }  变形放大 1.05 倍, 顺时针旋转10度。

.f-img { transition: all 300ms linear 0s; } 过渡，所有属性，过渡历时300毫秒，linear 匀速，过渡延时 0 秒