小兔鲜首页制作css

一、项目目录

项目名-客户端

xtx-pc

1.images：存放固定使用的图片，例如：logo、样式修饰图

2.uploads:存放非固定图片，例如：商品图、宣传图等需要上传的图片

3.iconfont:字体图标素材

4.css文件：

4.1base.css：基础的公共样式

4.2common.css：各个网页相同模块的重复样式，例如头部、底部

4.3index.css：首页css样式

5.index.html：首页html文件

二、 SEO搜索引擎优化

2.1提升SEO的三大方法

1.竞价排名

2.将网页制作成html标签

3.标签语义化（在合适的地方使用合适的标签）

2.2网页头部SEO标签 

title：网页标题标签

description：网页描述

keywords：网页关键词

三、Favicon图标

网页图标，出现在浏览器标题栏，增加网页辨识度

favicon.ico：一般存放在网站的根目录

使用link自动生成 

四、版心

公共样式存放到common.css文件

哪个元素需要就调用

设置上下边距为0，后续有需要再修改

/* 版心 */

.wrapper{

  margin: 0 auto;

  width: 1240px;

}

 五、快捷导航

5.1标签结构

通栏>版心>ul

5.2布局

flex-end  调整主轴对齐方式，右对齐

5.3常规样式

1.a靠内容撑开

2.右边块线，最后一个a不需要边块线（给a加的原因，a是行内元素靠内容撑开，边框线和文字一样高）

3.图标使用span标签引入，在文字前面

4.图标和文字取消基线对齐

.shortcut li .iconfont{
  margin-right: 4px;
  vertical-align: middle;
}

 5.4单独的样式

设置单独的类，对该样式单独设置

六、头部