【个人学习日志-前端】浏览器窗口大小改变后，超出视窗部分的导航栏div标签背景色丢失问题

项目场景：

  复刻小米商城前端html。

---

问题描述

  浏览器窗口宽度改变后，导航栏div标签超出视图的部分背景色丢失。

 问题如图：

---

 原因分析：

  导航栏的宽度是基于其子元素的宽度计算的，当窗口宽度较小时，子元素可能会换行或超出视窗，导致背景色无法覆盖整个导航栏。如果导航栏的布局没有正确处理响应式设计，当窗口宽度较小时，布局可能会塌陷，导致背景色丢失。

     min-width属性用于设置元素的最小宽度，确保元素在窗口宽度较小时不会缩小到小于指定的宽度。通过为导航栏设置min-width，可以确保导航栏在窗口宽度较小时仍然保持足够的宽度，从而避免背景色丢失。

---

解决方案：

在需要设置背景色的div标签下补充最小宽度即可

如：min-width：1226px；

 修改后效果如下：

 问题成功解决 ～(∠・ω< )⌒★！