1.网页效果
2.源代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>网页头部练习</title>
<script src="js/myfocus-2.0.1.min.js" type="text/javascript"></script>
<script src="js/mf-pattern/mF_taobao2010.js" type="text/javascript"></script>
<link href="js/mf-pattern/mF_taobao2010.css" type="text/css">
<script type="text/javascript">
myFocus.set({
id:'boxID',
time:2
});
</script>
<style type="text/css">
.text{
width:1000px;
margin:0 auto;
}
.logo{
height:80px;
background-color:white;
}
.leftlogo{
width:200px;
float:left;
}
.rightlogo{
width:300px;
height:30px;
color:#8E8E8E;
margin-top:15px;
float:right;
}
.rightlogo img{
vertical-align:middle;
}
.nav{
height:40px;
background-color:#8E8E8E;
}
.left-nav{
width:700px;
height:40px;
float:left;
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>网页头部练习</title>
<script src="js/myfocus-2.0.1.min.js" type="text/javascript"></script>
<script src="js/mf-pattern/mF_taobao2010.js" type="text/javascript"></script>
<link href="js/mf-pattern/mF_taobao2010.css" type="text/css">
<script type="text/javascript">
myFocus.set({
id:'boxID',
time:2
});
</script>
<style type="text/css">
.text{
width:1000px;
margin:0 auto;
}
.logo{
height:80px;
background-color:white;
}
.leftlogo{
width:200px;
float:left;
}
.rightlogo{
width:300px;
height:30px;
color:#8E8E8E;
margin-top:15px;
float:right;
}
.rightlogo img{
vertical-align:middle;
}
.nav{
height:40px;
background-color:#8E8E8E;
}
.left-nav{
width:700px;
height:40px;
float:left;