In addition to creating the project, installing AXIOS, and the framework, there is style reuse, logic reuse, and component reuse prior to project development.
- Clear the browser’s default styles
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;
}
Copy the code
- Common style
The solution is as follows:
- Style reuse
The same style is used in multiple places with different parameters, as shown below:
The solution is as follows:
Set up flex layout reuse in mixin.css
@include Flex () in reusing pages;
Similarly, background image styles are reused
- Set the theme color and regular font size Settings, which is conducive to the later change of color and font, and more convenient and high maintenance efficiency.
- Logic reuse
- Component reuse
The 1-4 points above are the notes I made during my previous study of MOOCs. The 5-6 points are my own summary, which have been useful in the actual development process. I think they are quite practical and frequently used, so I would like to share them here, hoping it will be helpful to you.
Hahaha, today is also a happy and beautiful day.