常见文件夹
- 项目文件夹 shopping
- 样式类图片文件夹 images
- 样式文件夹 css
- 产品类图片文件夹 upload
- 字体类文件夹 fonts
- 脚本文件夹 js
常见主页和样式文件
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>品优购</title>
<!-- 初始化样式 -->
<link rel="stylesheet" href="./css/base.css">
<!-- 公共样式 -->
<link rel="stylesheet" href="./css/common.css">
</head>
<body>
品优购
</body>
</html>
/* 所有元素内外边距清零 */
* {
margin: 0;
padding: 0;
/* css盒子模型更改 */
box-sizing: border-box;
}
/* em,i不倾斜 */
em,
i {
font-style: normal;
}
/* 去掉li的小圆点 */
li {
list-style: none;
}
img {
/* 照顾低版本浏览器 如果图片外面包含了链接会有边框问题 */
border: 0;
/* 取消底部有空白间隙 */
vertical-align: middle;
}
/* 鼠标经过按钮时,鼠标变成小手 */
button {
cursor: pointer;
}
/* 链接文本取消下划线 */
a {
color: #666;
text-decoration: none;
}
/* 鼠标经过链接时显示红色 */
a:hover {
color: #c81623;
}
/* 按钮,输入框字体 */
button,
input {
/* '\5B8B\4F53' 宋体的Unicode编码,避免浏览器CSS代码出现乱码问题 */
font-family: Microsoft YaHei, heiti SC, tahoma, arial, Hiragino SansGB, '\5B8B\4F53', sans-serif;
}
/* body默认背景颜色,字体,颜色 */
body {
/* CSS3康锯齿,让文字显示更加清晰 */
-webkit-font-smoothing: antialiased;
background-color: #fff;
font: 12px/1.5 Microsoft YaHei, heiti SC, tahoma, arial, Hiragino SansGB, '\5B8B\4F53', sans-serif;
color: #666;
}
/* 元素隐藏 */
.hide,
.none {
display: none;
}
/* 清除浮动 */
.clearfix:after {
visibility: hidden;
clear: both;
display: block;
content: "";
height: 0;
}
.clearfix {
*zoom: 1;
}
/* 公共样式 */
.w {
width: 1200px;
margin: 0 auto;
}