图片显示不出来

来源:3-8 企业网站制作之焦点图制作

secondhand98k

2018-04-07 10:02


<!DOCTYPE html>

<html>

<link rel="stylesheet" type="text/css" href="css/main.css">

<script type="text/javascript" src="../js/setHomeSetFav.js" charset="gb2312"></script>

<head>

<title>慕课网</title>

<script type="text/javascript"  src="js/myfocus-2.0.1.min.js"></script>

<script type="text/javascript" src="js/mf-pattern/mF_YSlider.js"></script>

<link rel="stylesheet" type="text/css" href="js/mf-pattern/mF_YSlider.css">

</head>

<body>

<div class="top">

<div class="top_content">

<ul>

<li><a href="#">联系我们</a></li>

<li> <a href="#" onclick="AddFavorite(window.location ,document.title)"> 加入收藏 </a> </li>

<li> <a href="#" onclick="setHome(window.location)""> 设为首页 </a> </li>

</ul>

</div>

</div>

<div class="wrap">

<div class="logo">

<div class="logo_left"><img src="images/logo.jpg" alt="慕课网"></div>

<div class="logo_right"><img src="images/tel.jpg" alt="服务在线"> 24小时服务热线:<span class="tel">123-444-554 </span></div>

</div>

</div>

<div class="nav">

<div class="nav_left"></div>


<div class="nav_mid">

<div class="nav_mid_left">

<ul>

<li><a href="#">首页</a></li>

<li><a href="list.html">关于慕课</a></li>

<li><a href="list.html">新闻动态</a></li>

<li><a href="list.html">课程中心</a></li>

<li><a href="list.html">在线课程</a></li>

<li><a href="list.html">人才招聘</a></li>

</ul>

</div>

<div class="nav_mid_right">

<form action="" method="post">

<input type="text/" name="">

</form>

</div>

</div>


<div class="nav_right"></div>

</div>


<div class="ad">

<ul>

<li><img src="../images/ad2.jpg"></li>

<li><img src="../images/ad3.jpg"></li>

<li><img src="../images/ad4.jpg"></li>

</ul>

</div>


</body>

</html>


*{

margin:0;

padding:0;

font-size: 12px;

}

body{

background-color: #F5F5F5;

}

.top{

width: 100%;

height: 27px;

background: : url(../images/top_bg.jpg) repeat-x;

}

.top_content{

width: 1000px;

margin: 0 auto;


}

.top_content li{

list-style-image: url(../images/li_bg.gif);

float: right;

width: 70px;

line-height: 27px;


}

.top_content a:link,.top_content:visited{

color:#8E8E8E;

text-decoration: none;

}


.top_content a:hover,.top_content:active{

color:#900;

text-decoration: none;

}

.wrap{

width: 1000px;

margin: 0 auto;

}

.logo{

height: 80px;

background-color: #FFF;


}

.logo_left{

width: 200px;

float: left;

}

.logo_right{

height: 28px;

color: #8E8E8E;

margin-top: 30px;


width: 300px;

float: right;

}

.logo_right img{

vertical-align: middle;

margin-right: 10px;

}

.tel{

font-family: "微软雅黑";

font-size: 16px;

color:#C00;

}

.nav{

height:40px;

margin-left: 220px;

float: left;

}

.nav_left{

width: 10px;

background: url(../images/nav_left.jpg) no-repeat;

height: 40px;

float: left;


}

.nav_mid{

width: 980px;

background: url(../images/nav_bg.jpg) repeat-x;

float: left;

}

.nav_mid_left{

width: 680px;

}

.nav_mid_left li{

float: left;

list-style: none;

line-height: 40px;


padding: 0 0 30px 30px;


}

.nav_mid_left li a:link,.nav_mid_left li a:visited{

color:white;

text-decoration: none;

font-size: 16px;

font-family: "微软雅黑";

}

.nav_mid_left li a:hover,.nav_mid_left li a:active{

color:#FF0;

text-decoration: none;

font-size: 16px;

font-family: "微软雅黑";


}

.nav_mid_right {

float: right;

line-height: 40px;

width: 300px;  

}

.nav_right{

width: 10px;

background: url(../images/nav_right.jpg) no-repeat;

height: 40px;

float: left;


}

.ad{

height: 310px;

}







写回答 关注

2回答

  • secondhand98k
    2018-04-07 10:51:48

    图片路径问题,解决

    second... 回复慕田峪346...

    要把图片的路径写全,我的是这样的问题,

    2018-05-07 10:09:31

    共 2 条回复 >

  • secondhand98k
    2018-04-07 10:03:46

    https://img3.mukewang.com/5ac826f100017f1e14400900.jpg

    图片显示不出来


企业网站综合布局实战

本课程重点介绍HTML/CSS实现常见企业网站布局的方法

157038 学习 · 2134 问题

查看课程

相似问题