制作步骤：
创建一个完整网站目录结构：
meishimeike(文件夹)：管理当前网站中所有的文件
index.html / default.html(文件)：当前网站的入口文件
CSS（文件夹）：管理当前网站中所有的 css 文件
js （文件夹）：管理当前网站中所有的 js 文件
images（文件夹）：管理当前网站中所有的图片
准备一张 PSD （用于转换为 html 页面的设计图）
确定一种开发方式
a) 从上到下的方式（比较适合新手）
b) 先确定结构再在结构中填充内容（比较适合老司机）
CSS初始化（消除浏览器中标签的一些默认 css 样式）：
去掉标签的默认 margin 和 padding ：html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend,img{margin:0; padding:0; }
去掉图片的边框：img{border: 0; }
去掉 ul 前面的小点：ul, ol{list-style: none; }
去掉 input 标签默认的 padding-top ，padding-bottom，border：input{padding-top: 0;padding-bottom: 0; border: none; }
去掉 a 标签的下划线：a{text-decoration: none; }
给 body 设置一个统一的字体样式和背景颜色：body{font: normal normal 12px "宋体"，color: #fff; background-color:#fae8c8; }
左右浮动，清除浮动 ：.fl{float:left;} .fr{float:right; } .clearfix:after{content:""; height: 0; line-height: 0 ; display: block; }
开始网站代码的书写
1）完成网站所有页面统一的头部和尾部
temple.html----------->temple.css
自制logo：将一张图上的不同图案分别置于不同的图层，再将所需图案复制到同一个图层中即可。
————————————————
版权声明：本文为CSDN博主「Shay_Maria」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/jxqingge/article/details/81427727