网站怎么上线sem是什么专业

头部：logo ,导航，搜索，购物车

头部总体布局:
设置好上下外边距以及总体高度， flex布局让总体一行排列

logo：

logo考虑搜索引擎优化，所以要使用 h1中包裹 a 标签，a 里边写内容（到时候直接将字号设置为0，就不影响logo图片的展示了）

导航区域

调整 导航中 li 的布局样式

 

调整 li 中  文字样式（base.css中  文字样式字体·已经设置为 16而且文字颜色设置为了#333，所以文字样式要是这两个那么就不用再设置了）

设置鼠标悬停时，a 中出现底部绿色边框线，以及文字颜色是变成绿色。

padding加给 a ，当鼠标悬停时，边框线出现以及文字内容变成绿色

搜索区域：
浏览器优先生效 input标签宽度，所以设置 flex:1;不生效，所以先将input宽度width 置0

 

购物车区域：

• 设置购物车字体图标
• 设置右上角商品数量（子绝父相，设置商品数量文字左对齐，右对齐的话内容向左撑开，可能盖住其他内容）