article { position: relative; transform-origin: 10% 50%; width: 100%; background-image: linear-gradient(45deg, #26d0ce, #1a2980); } article .wrapper { margin: auto; padding: 2em; max-width: 90%; height: 100%; display: flex; flex-direction: column; justify-content: space-between; } article .wrapper h1 { margin: 0; } article .wrapper .footer { text-align: right; }

这段代码是一个基本的CSS样式规则，用于设置一个网页文章（article）的样式。其中：

- `position: relative;` 表示该元素的定位方式为相对定位，即相对于元素本身原来所在的位置进行定位；
- `transform-origin: 10% 50%;` 表示该元素的变形起点为距离左侧10%、距离顶部50%的位置；
- `width: 100%;` 表示该元素的宽度为100%，即占据整个父容器的宽度；
- `background-image: linear-gradient(45deg, #26d0ce, #1a2980);` 表示该元素的背景颜色为从左上角到右下角的45度渐变色，颜色从#26d0ce到#1a2980；
- `.wrapper` 表示该元素内部的一个子元素，用于包裹文章内容；
- `margin: auto;` 表示该元素的外边距为自动，即在父容器中水平居中；
- `padding: 2em;` 表示该元素的内边距为2em；
- `max-width: 90%;` 表示该元素的最大宽度为父容器宽度的90%；
- `height: 100%;` 表示该元素的高度为100%，即占据整个父容器的高度；
- `display: flex;` 表示该元素使用flex布局；
- `flex-direction: column;` 表示该元素内部的伸缩项目（flex items）按照列（垂直）方向排列；
- `justify-content: space-between;` 表示该元素内部的伸缩项目之间的间距平均分布，即上下分别留有一定的空白间隔；
- `.wrapper h1` 表示该元素内部的h1标签元素；
- `margin: 0;` 表示该元素内部的h1标签元素的外边距为0；
- `.wrapper .footer` 表示该元素内部的class为footer的元素；
- `text-align: right;` 表示该元素内部的class为footer的元素的文本内容右对齐。