web学习过程2 静态网页实例2

今天，主要学习了添加导航栏菜单里面的内容。在导航栏里添加文本与超链接，我们用ul来表示无序列（ul是无序的，要想用有序的要用ol来表示），超链接标签为a, href 后接目标网站网址，下面这个就是点击标签后就会到百度网页。


然后可以清楚的看到每个标签并不是成行分布，而且是在左边，同时可以看到菜单区域与主体区域有多余的颜色（这个是背景色，box中设置的），说明有空区域显示，因为margin的边距不为0。

在css中添加代码，全局默认为边距0。

让列右对齐，去掉标签前面的点，设置宽度高度。

让标签居中（设置行高），从左一个一个的排列，设置每个标签的间距。

去掉标签字体下面的下划线，设置标签字体的大小，颜色，字体样式。

设置当鼠标方在标签上的颜色。

这样就将菜单导航栏设置完成了。

然后我们制作主体的左部分


在左区进行划分，然后导入图片。span没有特殊意义，仅表示添加了一段文字。

让内容（即照片）居中，并设置与padding的距离。

在照片周围设置一条边界，设置边界的形式（虚线，实线）与颜色，圆角。

各个边界的关系。