html css 效果图 如果我们想得到向左侧倾斜或者向右侧倾斜的梯形，只需要将transform-origin设置为bottom left 或者 bottom right即可 css 效果图 Read More
1. 一个切角 思路：如果我们要得到有一个切角的元素，我们只需要使用一个径向渐变就可以达到这个目标，这个渐变需要把一个透明色标放在切角处，然后再相同的位置设置另一个色标，并且把它的颜色设置成我们想要的背景色。 html css 效果图 2. 两个切角 由上面的例子，我们很快想到这么写 css 效果图 Read More
一、平行四边形 1. 使用两个元素实现 html css 效果图 原理： 将容器和内容区域做相反方向的变形，就可以使外面的容器变形，同时不会影响内部的元素。 2. 使用伪元素实现 我们可以把所有样式都应用到伪元素上，然后再对伪元素进行变形。因为我们的内容并不是包含在伪元素中，所以内容并不会受到伪元素 Read More
一、自适应的椭圆 1. 椭圆 css 效果图 2.半椭圆 所以现在我们知道怎么来实现半椭圆了吧： css 效果图 由图中效果可以知道，沿着横轴切割的椭圆相当于左上角和右上角的切角椭圆重合，并且左上角（右上角）切角椭圆的横轴半径占元素宽度的50%，纵轴半径占元素高度的100%，右下角（左下角）的没有圆 Read More
有时我们想把一个图片应用为边框，而不是背景，最简单的办法是使用两个HTML元素，一个元素用来把我们的石雕图片设置为背景，另一个元素用来存放内容，并设置纯白背景，然后覆盖在前者之上，这个方法需要一个额外的HTML元素，这显然不够理想，他不仅把结构和表现混合起来，而且在某些特定的场景下，修改HTML是做 Read More