如何使用 CSS 在导航栏下添加阴影？
How to add a shadow under a navbar using CSS?
在 HTML 和 CSS 方面，我绝对是初学者，所以我认为这对你们中的某些人来说可能听起来很容易。
我一直在寻找一种方法来向导航栏添加简单的阴影，就像 codecademy.com/ 上的阴影添加到我现有的导航栏一样。我在下面的 codepen 中包括了它的 HTML & CSS：
[https://www.codepen.io/CodingAddict/pen/QWbmBVQ][2]
只需在 css 文件中添加这一行
.site-header { box-shadow: 0 2px 4px 0 rgba(0,0,0,.1); }
改变这个
.site-header nav { box-shadow: 0 2px 4px 0 rgba(0,0,0,.2);}
要么
nav { box-shadow: 0 2px 4px 0 rgba(0,0,0,.2);}
向您的导航栏添加 box-shadow。不要 site-header.
nav {
box-shadow: 0 2px 4px 0 rgba(0,0,0,.2);
}
在 HTML 和 CSS 方面，我绝对是初学者，所以我认为这对你们中的某些人来说可能听起来很容易。
我一直在寻找一种方法来向导航栏添加简单的阴影，就像 codecademy.com/ 上的阴影添加到我现有的导航栏一样。我在下面的 codepen 中包括了它的 HTML & CSS：
[https://www.codepen.io/CodingAddict/pen/QWbmBVQ][2]
只需在 css 文件中添加这一行
.site-header { box-shadow: 0 2px 4px 0 rgba(0,0,0,.1); }
改变这个
.site-header nav { box-shadow: 0 2px 4px 0 rgba(0,0,0,.2);} 要么 nav { box-shadow: 0 2px 4px 0 rgba(0,0,0,.2);}
向您的导航栏添加 box-shadow。不要 site-header.
nav {
box-shadow: 0 2px 4px 0 rgba(0,0,0,.2);
}