准备工作——样式、逻辑、组件复用

在开发项目前，前期准备工作除了创建项目、安装axios，以及框架外，还有样式复用、逻辑复用，以及组件复用。

1. 清除浏览器自带的默认样式

body,div,p,h1,h2,h3,h4,h5,h6,ul,li,dl,dt,a,input,button,textarea,select{
  margin: 0;
  padding: 0;
  outline: none;
}
html,body{
  color: #333333;
  background-color: #ffffff;
  min-width: 1200px;
  font-size: 12px;
}
a{
  text-decoration: none;
}
ul,li{
  list-style: none;
}
input{
  font: normal;
}
input:focus,a:focus{
  outline: none;
}
复制代码

2. 公共样式

解决如下：

3. 样式复用

多处用到同样的样式，只是参数不同，如下图：

解决如下：

在mixin.css设置flex布局复用

在复用的页面 @include flex();

以此类推，背景图片样式复用

4. 设置主题色、常规字体大小设置，这样有利于后期更改颜色、字体，维护效率更便捷、高。

5. 逻辑复用

6. 组件复用

以上的1-4点是我以前学习慕课网的教程所做的笔记，5-6点是自己的总结，在实际开发过程中有用过，个人觉得挺实用的，使用频率也高，在此分享出来，希望对您有帮助。

哈哈哈，今天也是快乐美好的一天。