为了账号安全,请及时绑定邮箱和手机立即绑定

请问腾讯软件中心头部怎么写?用什么实现的

http://img1.sycdn.imooc.com//581b02ad00015e4609900110.jpg

不知道怎么写,怎么写都不对,求指教,感恩不尽


正在回答

3 回答

效果图:

http://img1.sycdn.imooc.com//582d7d380001740f10270204.jpg

代码:

<!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>


0 回复 有任何疑惑可以回复我~
#1

慕粉0317 提问者

非常感谢!
2016-11-18 回复 有任何疑惑可以回复我~

123124

0 回复 有任何疑惑可以回复我~

怎么写都不对,有没有类似的代码借鉴下,谢谢

0 回复 有任何疑惑可以回复我~

这是由几个背景图片组成还有p标签

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
网页布局基础
  • 参与学习       214707    人
  • 解答问题       1756    个

让你精通CSS中三大定位机制,彻底掌握网页布局的相关知识

进入课程

请问腾讯软件中心头部怎么写?用什么实现的

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信