1. text-align: left; 换行时是内容是从左往右排列
2.float: left; 位置在左
3. position: relative; 以这个容器为主体
4.position: absolute; 以有position: relative的容器为主体进行调整
5.margin: 10px 2px 3px 4px; (上右下左)容器外面一层,用于调整位置
6.padding: 1px; 容器内的一层
7.border: 1px solid #fff 容器边框 1px是边框线大小 solid表示实线 #fff表示颜色
8.box-sizing: border-box; 修改为容器内部 添加后border的1px会在容器大小(width,height)中减去
9. border-radius: 2px; 边框直角变圆角的程度
10.line-height: 22px; 每行的高度
11.background: linear-gradient(to bottom, #fdfdfd, #e9e9e9); 背景颜色渐变 to bottom表示由上到下
12.font-size: 14px; 字体大小
13.z-index: 1; 默认数值为0 大于0可以在其他图层上下显示
14. text-align: center; 文本居中
15.box-shadow: -10px 0px 10px red, /*左边阴影*/ 0px -10px 10px black, /*上边阴影*/
10px 0px 10px green, /*右边阴影*/ 0px 10px 10px blue;" /*下边阴影*/
16.如何在v-for中使用js中的数据
<div class="swiper-slide" v-for="item in imgs" :key="item.index">
<div class="bgimg" :style="{ backgroundImage: 'url(' + item.pic + ')' }">
<img :src="item.pic" />
<img src="@/assets/img/首页图库/download.jpg" class="download" />
</div>
</div>
17.-webkit-box-reflect 倒影
-webkit-box-reflect: below 1px -webkit-linear-gradient(transparent,transparent 80%,rgba(255, 255, 255, 0.3)); 效果如下
background 背景,可以用来制作透明框 如: background: rgba(48, 45, 45, 0.5);