如何用最简洁的css代码写一个导航栏
首先我们在里面通过标签添加一个logo,然后通过标签简单的设置几个导航栏中的内容。
注：标签主要是用于设置超链接。
<div><img src="logo.png"><a href="#">首页</a><a href="#">游戏中心</a><a href="#">游戏社区</a><a href="#">游戏动态</a></div>
这里是最初没有经过CSS 语句修饰的网页效果
现在通过CSS标签进行修饰
（1）首先，我们先给最外层的
标签进行设置，让导航栏的原始外框展示出来。
div {width: 1500px;height: 84px;background-color: #323235;}
(2)其次我们需要修改的就是标签的CSS属性：
a {width: 150px;height: 84px;color: #fff;font-size: 24px;/*文字水平居中*/text-align: center;/*设定行高等于盒子高度，垂直居中*/line-height: 84px;/*行内元素转换为块级元素*/display: inline-block;/*去除超链接文本的下划线*/text-decoration: none;}
标签中的后几个元素的设置也是导航栏的关键部分，同时给
标签也进行设置
img {width: 200px;height: 84px;margin-top: 10px;margin-left: 150px; float: left；}
此时简单的导航栏也出来了：
（3）最后，设置一个鼠标的点击效果就好了：
a:hover {color: yellow;}
大学生it技术交流QQ群
