css标题栏自适应屏幕 |cs6 css参数

nav{
background-color: #333;
width: 100%;
height: 50px;
}
nav ul{
margin: 0;
padding: 0;
list-style: none;
display: flex;
}
nav li{
flex: 1;
text-align: center;
line-height: 50px;
color: #fff;
font-size: 20px;
}

以上代码中，大家采用了flexbox布局，使导航栏能够适应不同屏幕宽度。其中nav元素的宽度设置为100%以占据整个屏幕宽度，高度设置为50px。ul元素的margin和padding设置为0，避免出现多余的空白区域。li元素通过flex: 1实现平均分配，text-align:center让文字居中显示，font-size:20px设置文字大小为20像素。

为了让标题栏有更好的用户体验，还可以添加一些交互效果，如hover效果、下拉菜单等，这些都可以通过CSS实现。