css创建圆形导航 |php登陆页面css代码

.nav {
list-style: none;
margin: 0;
padding: 0;
text-align: center;
}
.nav li {
display: inline-block;
margin: 0 10px;
}
.nav a {
display: block;
width: 50px;
height: 50px;
line-height: 50px;
text-align: center;
border-radius: 50%;
background-color: #333;
color: #fff;
text-decoration: none;
}
.nav a:hover {
background-color: #666;
}

以上代码中，大家通过设置列表样式为none、外边距和内边距为0、文本居中等方式，使得导航的样式更加整齐、美观。接着，大家设置导航列表项为inline-block，使每个项都能够在同一行内显示。然后设置导航链接的宽高、边框圆角、背景颜色、字体颜色等属性，以达到创建圆形导航的目的。

最后，大家设置鼠标悬停时的效果，使得导航在被鼠标悬停后可以更加明显。这样，一个圆形导航就创建完成了！