利用CSS建立网页左边导航?

一、CSS网页左边导航简介
CSS（Cascading Style Sheets）即层叠样式表，是一种用来表示网页的样式的计算机语言，可以提供文档的结构，排版，色彩等信息，它使网页的内容和表现形式分离，提高了网页的可维护性和可读性。

CSS网页左边导航是指网页中的左边条，它的作用是提供网页分块的菜单，一般用来放置网页的链接，使网页更加清晰，方便用户浏览。

二、利用CSS建立网页左边导航
1、首先，在页面中添加导航，它可以是一个ul标签，也可以是一个div标签，它包含了需要显示的菜单项，比如：



2、然后，使用CSS对导航进行样式设置，实现网页左边导航的效果，比如：

#nav {
width: 200px;
float: left;
margin-right: 10px;
}
#nav ul {
list-style: none;
margin: 0 0 10px 0;
padding: 0;
}
#nav li {
background: #e2e2e2;
padding: 5px;
border-radius: 5px;
margin-bottom: 5px;
}
#nav a {
color: #000;
text-decoration: none;
font-weight: bold;
font-size: 14px;
display: block;
}
#nav a:hover {
color: #f30;
}

3、最后，可以给导航添加一些动画效果和特效，比如：

#nav li:hover {
background: #f30;
color: #fff;
transition: all 0.3s ease-in-out;
}

上面的代码实现了一个简单的CSS网页左边导航，它使网页变得更加清晰，利于用户浏览。