效果

文字水平垂直居中

html代码

<header>        <div class="header-container">            <div class="header-nav">                <ul>                    <li><a href="#">首页</a></li>                    <li><a href="#">集团介绍</a></li>                    <li><a href="#">专家联盟</a></li>                    <li><a href="#">合作机构</a></li>                    <li><a href="#">新闻动态</a></li>                </ul>            </div>        </div>    </header>

css代码

header .header-nav {    height: 100px;}header .header-nav ul {    width: 100%;    height: 100px;    border: 1px solid #000;}    header .header-nav ul li {    display: inline-flex;    align-items: center;    justify-content: center;    height: 100px;}header .header-nav ul li a {    display: block;    padding: 0 30px;    line-height: 100px;    font-size: 20px;}