weixin_42504805的博客

网格内容水平对齐方式: justify-items:start(顶端) center(居中) end(末端) stretch(默认值)网格内容垂直对齐方式: align-items:start(顶端) center(居中) end(末端) stretch(默认值)rotate3D(x,y,z,deg) x,y,z取值范围: 0-1矢量 向量(某个方向旋转角度的比例) 绕着自定义的轴。background: rgba(0-255,0-255,0-255,0-1)0-1表示透明度-->

Element-ui 官网: https://element.eleme.cn/#/zh-CN/component/installation。微信开发文档官网：https://developers.weixin.qq.com/miniprogram/dev/framework/Vant-ui 国内官网: https://vant-contrib.gitee.io/vant/#/zh-CN/mdn国内官网：https://developer.mozilla.org/zh-CN/docs/Web/HTML。

日常开发中很多商城类项目都需要涉及优惠营销类，自然少不了优惠券的页面制作。而优惠券的设计经常会遇到凹槽，对于刚入门的前端来说没接触过就可能很难想象出如何能用纯CSS写出凹槽，很多人会使用图片作为背景，但使用图片有很大弊端，适用性不够广泛、不易扩展、图片较大占用网络等等。相反使用CSS实现容易扩展优惠券内容，几行代码又大大减小网络占用。

我的右边边框无边线而其它三边为黑色虚线边框实例Html代码： 我的左边为黑色虚线边框Html代码： 我的右边为黑色虚线边框

属性用于描述弹性盒子容器的对齐方式。它包含沿着分布在浏览器中的 flex 容器的主轴的内容项之间和周围的空间。弹性项目以均匀的间距放置在项目被推到开始和最后一个项目被推到结束的地方。弹性项目以相等的间距放置，即在彼此之间和角落之前，之间和之后。项目以相等的间距定位，但与角落的间距不同。它在容器的中心对齐弹性项目。属性，其中属性值设置为。属性，其中属性值设置为。属性，其中属性值设置为。属性，其中属性值设置为。属性，其中属性值设置为。属性，其中属性值设置为。属性，其中属性值设置为。属性，其中属性值设置为。

浮动，顾名思义，就是漂浮的意思。指的是一个元素脱离文档流，悬浮在父元素之上的现象。

3，display：inline-block最大的优势便是不会脱离文档流，也可以让其元素在一行显示，在多个元素并排且有其子元素需要换行显示的时候优势极为明显，可以省去很多的配置时间。1，float浮动的元素会脱离文档流，下面的元素会占据他原来的位置，需要通过清除浮动的方法来让元素显示在正常位置。没有为父元素设置宽度，所以父元素的宽度为100%，而高度则是由子元素撑开，既高度自适应。flex：父元素的尺寸不会跟随子元素尺寸动态调整，不设置时默认是100%display: flex 将对象作为弹性伸缩盒显示。

双飞翼布局是淘宝提出的，是针对圣杯布局的一个优化方案（使用了定位）.解决方法就是在center中在添加一个一个inner盒子，并为其设置margin-left和margin-right,这样中间盒子的内容区域就不会被覆盖。思路: 给左右两边的盒子设置固定的宽高并设置左右浮动，中间盒子通过设置margin-left和margin-right(margin的值为到父元素两侧的距离)（2）在这些行内元素的父元素上设置font-size设置为0，再在行内元素上设置正常的字体显示大小。主要通过flex属性实现。

效果：