网页建设中遇到的问题.

zoukankan html css js c++ java

网页建设中遇到的问题.

1.加大图轮播导致1.导航字体大小改变 2.轮播不可用,在图片路径无误的情况下,图片亦不显示

2.点击导航栏弹出二级导航会挤走下部文件.尝试下部文件设置绝对定位未解决

3.这部分整个往右走了180px 不能调回!

<!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>
   *{
       margin:0px;
       padding:0px;
       list-style:none;
       }
       body{
           background:url(background.jpg);
           }
       #top{
           height:178px;
           100%;
           position:relative;
           float:left;

           }
       .t1{
           207px;
           height:118px;
           margin-left:6%;
           position:relative;
           float:left;
           /*margin-top:0px;*/
           line-height:118px;

           }
       .t2{
           500px;
           height:118px;
           position:relative;
           float:left;
           margin-top:0px;
           /*border:1px solid red;*/}

       .t3{
           500px;
           height:118px;
           position:relative;
           float:left;
           /*border:1px solid blue;*/}
       .t31{
           400px;
           height:27px;
           position:relative;
           float:left;
           /*border:1px solid grey;*/
           text-align:center;
           margin:0px auto;
           margin-top:4px;}
       .ts{
           position:relative;
           float:left;

           border-right:solid 1px grey;
           }
       .ts:hover{
           opacity:0.5;}
       .t32{
           190px;
           height:54px;
           position:relative;
           float:left;
           margin:0px auto;
           margin-left:240px;
           /*border:1px solid red;*/}
       .ti{
           56px;
           height:54px;
           position:relative;
           float:left}
       .t33{
           100px;
           height:20px;
           position:relative;
           float:left;
           margin-left:255px;}
       #nav{
           80%;
           height:60px;
           position:relative;
           float:left;
           margin:0px auto;
           line-height:60px;
           /*border:1px solid red;*/
           margin-left:10%;
           }
       .n{
           14%;
           max-height:60px;
           position:relative;
           float:left;
           line-height:60px;
           text-align:center;
           overflow:hidden;
           /*border:1px blue solid;*/}
       .n:hover{
           max-height:300px;
           transition:1s;
           cursor:pointer;
           background:#0CC;}
       .n li:hover{
           background-color:#0F0}
       .n ul{
           opacity:0.5;}

       #middle{
           position:relative;
           float:left;

           /*margin-right:600px;*/
           /*100%;
           height:34px;*/
           /*border:1px solid red;*/}
       #du{
           1150px;
           height:450px;
           position:relative;
           float:left;
           /*border:1px solid black;*/
           margin-left:50px;
           }
       .d1{
           24%;
           height:450px;
           position:relative;
           float:left;
           border:1px solid black;
           margin-left:3px;}
       .d11{
           height:40px;
           160px;
           position:relative;
           float:left;
           /*border:1px solid red;*/}
       .d12{
           262px;
           height:175px;
           position:relative;
           float:left;
           /*border:1px solid green;*/
           }
       .d13{
           220px;
           height:170px;
           position:relative;
           float:left;
           /*border:1px solid #609;*/
           line-height:35px;}
       .q{
           line-height:35px;}
       #bottom{
           100%;
           height:120px;
           }
       .b1{
           100%;
           height:40px;
           position:relative;
           float:left;
           margin-left:400px;}
       .b2{
           100%;
           height:40px;
           position:relative;
           float:left;
           margin-left:200px;}
       .b3{
           100%;
           height:40px;
           position:relative;
           float:left;
           margin-left:550px;
           margin-top:10px;}
</style>
</head>

<body>
   <div id="top" style="100%; height:178px; background:url(01.jpg)">

        <div class="t1"><img src="jurangaiban_03.jpg" /></div>
        <div class="t2"><img src="jurangaiban_04.jpg" /></div>
        <div class="t3">
           <div class="t31" style="font-size:16px; color:#3CF">
               <span class="ts">顾客留言</span>
                <span class="ts">人才招聘</span>
                <span class="ts">服务监督员</span>
                <span class="ts">我要举报</span>
                <span class="ts">English</span>

            </div>
            <div class="t32">
               <div class="ti"><img src="1_11.jpg" /></div>
                <div class="ti"><img src="1_12.jpg" /></div>
                <div class="ti"><img src="1_13.jpg" /></div>

            </div>
            <div class="t33"><h3>400-650-3333</h3></div>
        </div>
            <div id="nav">　　　　　　　　点击导航栏弹出二级导航会挤走下部文件.尝试下部文件设置绝对定位未解决
               <div class="n"><h3>首页</h3></div>
                  <div class="n"><h3>集团简介
                   <ul>
                       <li>企业文化</li>
                        <li>企业荣誉</li>
                        <li>发展战略</li>
                        <li>下属公司</li>
                    </ul>
                </h3></div>
               <div class="n"><h3>新闻中心</h3></div>
               <div class="n"><h3>促销活动</h3></div>
               <div class="n"><h3>招商连锁
                   <ul>
                       <li>下载分店联系列表</li>
                        <li>招商流程</li>
                    </ul>
                </h3></div>
               <div class="n"><h3>会员中心
                   <ul>
                       <li>积分兑换</li>
                        <li>服务申请</li>
                    </ul>
                </h3></div>
               <div class="n"><h3>设计家</h3></div>




<div id="middle" style="1151px; height:34px; background:url(41.png)">

</div>　　
<div id="du">　　　　　　　　　　这部分整个往右走了180px 不能调回!
   <div class="d1">
       <div class="d11"><img src="jtxw.jpg" />　　　　　　　　
        </div>
        <div class="d12">
           <img src="bu1.jpg" />
        </div>
           <tr>荣成博隆店招商发布会圆满落幕</tr>
        <div class="d13" style="text-align:center; font-size:12px;">

           <ul type="square">
               <li><img src="xiaobiao_76.jpg" /> 居然之家威海店招商发布会圆满落</li>
                <li><img src="xiaobiao_76.jpg" /> 居然之家无锡锡沪路项目成功签约</li>
                <li><img src="xiaobiao_76.jpg" /> 以实际行动反哺教育事业汪林朋董</li>
                <li><img src="xiaobiao_76.jpg" /> 居然之家首推“一次消费，终身服</li>
                <li><img src="xiaobiao_76.jpg" /> 居然之家会员积分兑换更改啦~</li>

            </ul>
        </div>

    </div>
    <div class="d1">
       <div class="d11"><img src="xw_53.jpg" />
        </div>
        <div class="d12">
           <img src="bu2.jpg" />
        </div>
           <tr>居然快屋家装样板间征集令！</tr><br />
             <div class="q"><p>   快屋家装样板间征集令，全城限量199户！豪华家电限时送，多重好礼享不停。参与现场活动，豪礼多多！详情咨询：400-0065-095<font color="#0000FF">[点击进入]</font></p></div>
    </div>
    <div class="d1">
       <div class="d11"><img src="xw_56.jpg" />
        </div>
        <div class="d12">
           <img src="bu3.jpg" />
        </div>
           <tr>2017迎春大礼漫天飞舞</tr><div class="q"><p>   工程保修10年，专业第三方监理，交1000享工程97折，设计8折，主材预存最高享家装增值10%<font color="#0000FF">[点击进入]</font></p></div>
    </div>
    <div class="d1">
       <div><img src="54.png" /></div>
        <div><img src="15856.png" /></div>
    </div>

</div>
<div id="bottom">
   <div class="b1" style="text-align:center"><font color="#0033CC">
       <table align="center" height="15px" width="400px">
           <tr>
               <td>联系我们</td>
                <td>网站地图</td>
                <td>友情链接</td>
                <td>商户专区</td>

            </tr>
        </table></font>
    </div>
    <div class="b2">
       <font color="#0033CC"><p></p>Copyright 居然之家 2003-2016, All Rights Reserved. 京ICP备05048971号京公网安备11010102001707号</font>
    </div>
    <div class="b3"><img src="pic.gif" /></div>

</div>
</body>
</html>

加大图轮播导致1.导航字体大小改变 2.轮播不可用,在图片路径无误的情况下,图片亦不显示

查看全文

相关阅读:
android动态主题切换（RRO 技术）
Android设计模式-单例模式
 Android 设计模式
 简单理解Binder机制的原理
 Android的Activity启动流程分析
 android 多线程实现方式、并发与同步学习总结
 RecyclerView 缓存机制 | 如何复用表项？
recyclerview 缓存讲解
 csharp中实现图片拖拽
 特征提取的综合实验（多种角度比较SIFT、SURF、BRISK、ORB、FREAK等局部特诊点检测和描述算法)（2021版）

原文地址：https://www.cnblogs.com/zhangbaobao/p/6678077.html