header { height: 200px; width: 100%; padding-left: 500px; background-color: grey; border-bottom: solid blue 6px; } a { display: block; float: left; width: 125px; height: 50px; border: solid blue 2px; padding-left: 2px; border-radius: 15px 15px 0px 0px; text-align: center; line-height: 50px; color: white; background-color: black; }@H_404_8@<header> <a href="#home">Home</a> <a href="#news">News</a> <a href="#contact">Contact</a> <a href="#about">About</a> </header>@H_404_8@我试图设定最低点：0;但没有结果.我也尝试了margin-top和padding-top,但是结果是标题的高度不同.如果我将边距或填充设置为200px,则标题会提高200px.
最佳答案
只需将header的CSS编辑为：
header{ height: 200px; width: 100%; padding-left: 500px; background-color: grey; border-bottom: solid blue 6px; display: flex; flex-direction: row; justify-content: center; align-items: flex-end; } a { display: block; float: left; width: 125px; height: 50px; border: solid blue 2px; padding-left: 2px; border-radius: 15px 15px 0px 0px; text-align: center; line-height: 50px; color: white; background-color: black; }@H_404_8@<header> <a href="#home">Home</a> <a href="#news">News</a> <a href="#contact">Contact</a> <a href="#about">About</a> </header>@H_404_8@
