预览加载中，请您耐心等待几秒...

Web页面的开发流程及规范.docx

预览
1/10
2/10
3/10
4/10
5/10
6/10
7/10
8/10
9/10
10/10

亲，该文档总共12页，到这已经超出免费预览范围，如果喜欢就直接下载吧～

下载提示 文本预览

如果您无法下载资料，请参考说明：

1、部分资料下载需要金币，请确保您的账户上有足够的金币

2、已购买过的文档，再次下载不重复扣费

3、资料包下载后请先用软件解压，在使用对应软件打开

Web页面的开发流程及规范 页面开发流程 在写页面之前要先仔细的观察下页面，在心里对页面要有布局一下。比如下边这个页面：我们看到这个页面，要知道这个页面要怎么布局的才能合理: 1）最外层我们要用一个大的盒子包裹起来要定义---->wrap 2）然后头部（关注微信和下边logo包括导航条）---->header ①关注微信那块用---->sub_header ②下边就是导航用---->nav 3）下边就是我们的主体部分（banner和登录框）---->main（content） ①主题图片用---->banner ②登录框就用---->login 4）底部这部分内容就用---->footer <!DOCTYPEhtml><html><headlang="en"><metacharset="UTF-8"><title></title><style>*{padding:0;margin:0;border:0;}.wrap{width:100%;height:auto;font-size:24px;text-align:center;}.header{width:100%;height:100px;background:#0050ef;color:#fff3f3;}.header_top{width:100%;height:40px;background:#000;}.header_bottom{width:100%;height:60px;background:#fff;color:#000;}.main{width:100%;height:500px;background:#0099FF;}.footer{width:100%;height:80px;background:#fff;}.footer_nav{width:100%;height:40px;background:#fff3f3;}.copyRight{width:100%;height:40px;background:#000;color:#fff;}</style></head><body><divclass="wrap"><divclass="header"><divclass="header_top">微信</div><divclass="header_bottom">logo+导航</div></div><divclass="main">主体banner</div><divclass="footer"><divclass="footer_nav">首页导航</div><divclass="copyRight">版权</div></div></div></body></html> 1.页面文件的命名 html文件命名:英文命名,后缀.htm.用小驼峰命名规则：第一个单词以小写字母开始；第二个单词的首字母大写或每一个单词的首字母都采用大写字母 注意事项 1）、所有的命名最好都小写也可用小驼峰命名规则2）、属性的值一定要用双引号("")括起来，且一定要有值如class="divcss5",id="divcss5"3）、每个标签都要有开始和结束，且要有正确的层次，排版有规律工整4）、表现与结构完全分离，代码中不涉及任何的表现元素，如style、font、bgColor、border等5）、<h1>到<h5>的定义，应遵循从大到小的原则，体现文档的结构，并有利于搜索引擎的查询。6）、给每一个表格和表单加上一个唯一的、结构标记id7）、给图片最好加上alt标签 8）、尽可能减少div嵌套,如<divclass="box"><divclass="welcome">欢迎访问XXX,您的用户名是<divclass="name">用户名</div></div></div>完全可以用以下代码替代:<divclass="box"><p>欢迎访问XXX,您的用户名是<span>用户名</span></p></div>;9）、尽量使用英文命名原则10）、尽量不缩写，除非一看就明白的单词 2.HYPERLINK"http://www.divcss5.com/rumen/r29.shtml"CSS样式文件命名如下 Css样式命名有两种“.”和“#”。 无论是使用“.”（小写句号）选择符号开头命名，还是使用“#”(井号)选择符号开头命名都无所谓，但我们最好遵循，主要的、重要的、特殊的、最外层的盒子用“#”(井号)选择符号开头命名，其它都用“.”（小写句号）选择符号开头命名，同时考虑命名的HYPERLINK"http://www.divcss5.com/rumen/r61.shtml"CSS选择器在HTML中重复使用调用 样式一般分为三种：1行内样式2内嵌样式3外