7.搭建一个小鱼仙pc端构架

112 阅读1分钟

1.文件准备工作 1.1 在实际开发中,项目文件夹不建议使用中文 1.2 复制 favocon.ico到根目录文件夹 1.3 image:存放网站的固定使用图片素材,logo,样式图片等 1.4 uploads 存放非固定使用的图片素材,商品图片,宣传图片 1.5 新建index。html 在根目录 1.6 新建CSS文件 base.css 基础公共样式 common.css 该网站中多个网页相同模块的重复样式:如头部,底部 index.css 首页样式 2.基础公共样式
一般项目开始前,首先会去掉浏览器的样式,设置为当前项目需要的初始化样式。 防止不同浏览器中标签默认样式不同的影响, 已经准备好的bass,项目中可以直接引入使用 3.基本骨架 3.1 语言设置 <html lang="zh-CN"> 3.2 标题设置 <title>小兔鲜儿-新鲜、惠民、快捷!</title> 3.3 网页描述 <meta name="description" 3.4 网页关键字 <meta name="keywords" 3.5 引入favocioc.ocn图标 <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" /> 3.6 引入公共样式

 <link rel="stylesheet" href="./css/base.css" />
    <link rel="stylesheet" href="./css/common.css" />
    <link rel="stylesheet" href="./css/index.css" />

4.头部开发 header

1.png 4.1 头部分析 有2个部分组成   第一行-快速访问xtx-shortcut 第二行-网页主要导航 4.2 xtx-shortcut 快捷  宽带占满   通栏---快捷导航在--宽度固定 水平居中的盒子---网页版心 导航nav  ul  li  a标签    另外设置右浮动 1.png

4.3 主导航  -在版心位置   PC端都有版心

1.png 4.4 logo 的seo 需要 写上文字信息

5.footer 底部

1.png

1.png 6.网站入口:

1.png

1.png

1.png