Loading...
背景缩放(CSS3)通过background-size设置背景图片的尺寸，就像我们设置img的尺寸一样，在移动Web开发中做屏幕适配应用非常广泛。其参数设置如下：a) 可以设置长度单位(px)或百分比（设置百分比时，参照盒子的宽高）b) 设置为cover时，会自动调整缩放比例，保证图片始终填充满背景区域，如有溢出部分则会被隐藏。我们平时用的cover 最多c) 设置为contain会自动调整...
web中的字体web中的字体，和系统无关，系统有无该字体不影响最终的显示效果，不同浏览器所支持的字体格式是不一样的。TureTpe(.ttf)格式.ttf...
CSS3引入的布局模式Flexbox布局，使得我们对块级元素的布局排列变得十分灵活，适应性非常强，其强大的伸缩性，在响应式开中可以发挥极大的作用。首先我们先理解几个概念：主轴：Flex容器的主轴主要用来配置Flex项目，默认是水平方向。侧轴：与主轴垂直的轴称作侧轴，默认是垂直方向的。方向：默认主轴从左向右，侧轴默认从上到下。注意：主轴和侧轴并不是固定不变的，通过flex-direction可...
columns语法:columns:[ column-width ] || [ column-count ]，设置或检索对象的列数和每列的宽度。相关属性分...
描述：用CSS3描述太阳系行星的运动情况，小行星带使用的使用的是一张图片。原理就是利用的CSS3的动画属性，让每一个行星在每一个块级元素的边上，让该块状元素进行旋转，给每一个块状元素设置圆角，使得每一个块级元素全部显示为圆形。效果：附：小行星带代码实现：<!DOCTYPE html> <html lang="en"> <head> ...
描述：用CSS3的动画来实现无缝滚动，鼠标经过的时候，无缝滚动暂停，通过animation-play-state: paused;来进行控制，该属性有两个...
描述：该案例是使用CSS来描写的，所使用的技术有：linear-gradient线性渐变，animation动画，box-shadow阴影等css3的属性。效果图：示例代码：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">...
描述：通过CSS3的动画来制作轮播图，该图片占满整个屏幕，通过点击下方对应的按钮，就可以实现图片的更换。实现代码：<!DOCTYPE html>...
background-size 属性规定背景图像的尺寸。语法：background-size: length|percentage|cover|contain;参数说明：值描述length设置背景图像的高度和宽度。第一个值设置宽度，第二个值设置高度。如果只设置一个值，则第二个值会被设置为 "auto"。percentage以父元素的百分比来设置背景图像的宽度和高度。第一个值设置宽度，第二个值...
动画是CSS3中具有颠覆性的特征之一，可通过设置多个节点来精确控制一个或一组动画，常用来实现复杂的动画效果。1、必要元素：a、通过@keyframes指定...
