（21）使用CSS实现响应式导航栏补充

内容：介绍如何使用CSS媒体查询实现响应式导航栏。

HTML代码：创建导航栏结构。

CSS代码：使用媒体查询调整导航栏布局。

• Home
• About
• Contact

/* CSS */ @media (max-width: 600px) { nav ul { flex-direction: column; } } 详细解释：这篇博客详细介绍了如何使用CSS媒体查询实现响应式导航栏。首先，我们使用HTML创建了一个简单的导航栏结构。然后，使用CSS对导航栏进行了美化，并使用媒体查询在屏幕宽度小于600px时，将导航栏的布局从水平改为垂直。