请问腾讯软件中心头部怎么写？用什么实现的
慕粉0317
2016-11-03 17:29
不知道怎么写，怎么写都不对，求指教，感恩不尽
4回答
-
- 甜甜圈1991
- 2016-11-17 17:50:25
效果图：
代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
* {
margin:0;
padding:0;
}
/*应用全局 a伪类样式 p*/
a{color:white; text-decoration:none}
p{ font:12px/1.5 Tahoma, Helvetica, Arial, sans-serif;}
#top{ height:22px; background:#F8F8F8; line-height:22px; border-bottom:1px solid #cccccc;}
#header {
margin:0 auto;
width:910px;
}
/*logo存放样式*/
#header .logo { background: url(http://s.pc.qq.com/pc/images/910x70moren.jpg) no-repeat; height:70px; width:440px; float:left}
/*logo右边内容展示区 样式*/
#header .r_logo{ float:right; width:470px; padding-top:20px; height:50px;}
.titleMenu{ height:32px; clear:both; background:#36F}
.titleMenu .Nav, .right_nav{ height:32px; width:100%; line-height:32px; font-size:14px; color:#ffffff; font-weight:bold; text-align:center; background:url(http://s.pc.qq.com/pc/images/navbgnew1125.gif) no-repeat; float: left}
/*导航栏制作，左浮动*/
.titleMenu .Nav li{ float:left; margin-left:10px; width:94px; height:36px; list-style:none; }
/*定义选中导航栏的样式*/
.titleMenu .Nav .nav_a{background:url(http://s.pc.qq.com/pc/images/icon_s.png) repeat scroll 0 0 transparent; margin-top:4px;}
.titleMenu .Nav .nav_a a{ color:#000;} /*被选中的导航栏字体显示黑色*/
</style>
</head>
<body>
<div id="top"></div>
<div id="header">
<div class="logo"> </div> <!--logo存放-->
<div class="r_logo"> <!--logo右边内容展示区-->
<h4>腾讯软件中心，腾讯精品软件展示台</h4>
<p>我们会不断提升产品的性能和体验，为你打造最好用的软件！</p>
</div>
<!--导航栏-->
<div class="titleMenu">
<ul class="Nav">
<li class="nav_a"><a href="#">首页</a></li>
<li ><a href="#">PC 产品 </a></li>
<li ><a href="#">Mac 产品 </a></li>
<li ><a href="#">无线产品 </a></li>
<li ><a href="#">企业产品 </a></li>
</ul>
</div>
</div>
</body>
</html>
-
- 慕码人5192630
- 2016-11-04 13:57:39
123124
-
- 慕粉0317
- 2016-11-04 09:49:48
怎么写都不对，有没有类似的代码借鉴下，谢谢
-
- 不是不是而是是不是
- 2016-11-03 17:58:46
这是由几个背景图片组成还有p标签
网页布局基础
214679 学习 · 1833 问题