- margin:10px(上边距) 5px(右边距)15px(下边距) 20px(左边距);
- margin:10px(上外边距) 5px(左右外边距) 15px(下边距)
- margin:0 auto(上下0,居中)
- box-shadow:10px 10px 5px #eeeeee
第一个值为正下阴影,为零上下阴影,为负上阴影
第二个值为正右阴影,为零左右阴影,为负左阴影
第三个值阴影半径,第四个阴影颜色 - 使用flex布局显示商城商品页面时,父层要用flex-wrap:wrap自动换行可以再用justify-content:space-between;排列,可以自动安排边距会比较整齐
- 当使用v-for循环同一个view时,可以用.classname:first-child/last-child对第一个和最后一个设置不一样的样式
- 动画效果
实例背景颜色从红变蓝
@keyframes mymove
{
from {background-color:red;}
to {background-color:blue;}
}
.classname{
animation: mymove 5s//动画名 动画时间
}
- 使用float浮动时要用clear:both清除浮动
- 尽量要使用百分比去定义一些宽和高
- 使用caret:#eeeeee可以自定义光标的颜色
- 1rpx=0.5px=1 1rem=(750/20)rpx
cursor属性
auto:自动按照默认状态自行改变
crosshair:精准定位十字
default:默认鼠标指针
hand:手形
move:移动
help:帮助
wait:等待
text:文本
n-resize:箭头朝上双向
s-resize:箭头朝下双向
w-resize:箭头朝左双向
e-resize:箭头朝右双向
ne-resize:箭头朝右上双向
se-resize:箭头朝右下双向
nw-resize:箭头朝左下双向
se-resize:箭头朝左上双向
pointer:指示
url(url):自定义鼠标指标