静态网页的制作步骤 |
您所在的位置:网站首页 › js制作网页制作步骤图 › 静态网页的制作步骤 |
1. 创建一个完整网站目录结构:
meishimeike(文件夹):管理当前网站中所有的文件 index.html/default.html(文件):当前网站的入口文件 css(文件夹):管理当前网站中所有的css文件 js (文件夹):管理当前网站中所有的js文件 images(文件夹):管理当前网站中所有的图片 2. 准备一张PSD(用于转换为html页面的设计图) 3. 确定一种开发方式:1) 从上到下的方式:(比较适合新手) 2) 先确定结构再在结构中填充内容(比较适合老司机) 4. css初始化(清除浏览器中标签的一些默认样式):1) 去掉标签的默认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} 2) 去掉图片的边框: img{border:0} 3) 去掉ul前面的小点 ul,ol{list-style:none} 4) 去掉input标签默认的padding-top,padding-bottom,border input{padding-top:0;padding-bottom:0;border:none} 5) 去掉a标签的下划线 a{ text-decoration: none;} 6) 给body设置一个统一的字体样式和背景颜色 body {font: normal normal 12px "宋体";color: #4c4c4c;background-color: #fae8c8;} 7) 左右浮动,清除浮动 .fl {float: left;}.fr {float: right;}.clearfix:after {content: "";height: 0;line-height: 0;display: block;visibility: hidden;clear: both;}.clearfix {zoom: 1;} 5. 开始网站代码的书写:1) 完成网站所有页面统一的头部和尾部: temple.html------>temple.css
相关文档出自 http://stu.ityxb.com/index.html#/videocourse/coursedetail/b/259 |
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |
CopyRight 2018-2019 实验室设备网 版权所有 win10的实时保护怎么永久关闭 |