本文详细介绍了如何编写天猫侧边导航栏，包括声明HTML结构、设置样式、利用无序列表实现导航条，以及为各个导航项添加鼠标悬停效果。通过盒模型和CSS样式完成布局和交互设计。
天猫侧边导航栏设计思路;
第一步; 声明网页 <html> 编辑四大内容 ( 万国码,关键字,描述 标题)
第二步;在网页中画出一个容器 ,用来包裹所有内容 <div class="wrap">
第三步: 容器中放入导航条 (还是在body中)用无序列表实现. <ul>li </ul>
第四步: 对网页中画出的骨架开始逐一书写样式.
对 body 书写样式 : 清除浏览器默认自带的外边距
对容器 wrap进行样式设计: 宽 高 .外边距 .背景颜色
对无序列表设计样式 : 清楚小黑点 设置内外边距;
对列表整体设计使其合理放入wrap 中: 使用怪异盒模型
对导航头 设计样式: head 部分.(即,"导航"两个大字)
最低0.47元/天 解锁文章
扫一扫
1496
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
