web第一次css+html实践--day04

第一次实践css+html总结
1.鼠标移动查看大图
给图片加一个链接，设置

<a href="#" title="点击查看大图"><img src="img/map1.jpg"  /></a>

2.设置全局导航条

html代码：
<div id="globallink">
		   <ul>
		   ...
		    <li><a href="#">资源下载</a></li>
			 <li><a href="#">雁过留声</a></li>
		 </ul>
		</div>
css代码：
#glob{/设置导航条大小
	height: 15px;
	width: 780px;	
}

#glob ul{//去掉无序列表的表头图案
	list-style: none;
}
#glob li{///真正实现左浮动（导航条形式）代码
	text-align:center;
    width:78px;
	font-size: 12px;
	float: left;		
}

3.获得焦点

#glob a{
	display:block;	- 显示块元素的链接，让整体变为可点击链接区域（不只是文本），它允许我们指定宽度
	background: url(../img/button1.jpg);//背景图片
	padding: 15px,6px,15px,6px;//内边距。
	margin: 0px;外边距
}
#glob a:link, #glob a:visited{
	color:#004a87;
	text-decoration:underline; 文字设置下划线
}
#glob a:hover{
	color:#FFFFFF;
	text-decoration:none;//文字无效果
	background: url(../img/button1_bg.jpg);//当获取焦点时切换的背景图片
}

4.其他
border-bottom-style: dashed;/设置下边框（此虚线）