任务要求：
简单对网页进行分割布局，基本思路上中下三部分，然后在每一部分细分
无标题文档 搜索产品
苹果iphone 4手机将于9月25日在中国上市
日前中国联通正式宣布将于9月25日9时在中国大陆市场全面推出iPhone4，并为iPhone4用户量身定制了合约计划。
产品导购企业历史多角度对比 苹果iPod系列真机 导言：北京时间9月2日凌晨1点苹果在旧金山举行新品发布会，数码特派记者在美国现场直播…
企业历史使用问答
- 最新出的这个产品如何使用？
- 该产品采用全新的技术，较上一产品有质的飞跃，功能上增强了许多，使用方法更加简便...
- 最新出的这个产品如何使用？？
- 该产品采用全新的技术，较上一...
- 最新出的这个产品如何使用？？
- 该产品采用全新的技术，较上一产品有质的飞跃，功能上增强了....
- 最新出的这个产品如何使用？？
- 该产品采用全新的技术，较上一产品有质的飞跃，功能上增强了....
- 最新出的这个产品如何使用？？
- 该产品采用全新的技术，较上一产品有质的飞跃，功能上增强了许多，使用方法更加简便...
联系我们
Copyright © 2007 - 2010 aa25.cn All Rights Reserved
标准之路 版权所有 京ICP备10007159号
产品名称
/* CSS Document */*{ margin: 0; padding: 0;}#body{ margin: 0 auto; width: 905px; height: 1200px;}/*顶部div*/#top{ width: 100%; height: 75px; }/*中间div*/#content_top{ width: 100%; height: 260px; margin-top: 10px; }.logo{ background-image:url(../images/logo.jpg); background-repeat: no-repeat; height: 75px; width: 185px; background-position:0 50%; display: inline-block; float: left;/*即使给div设置了宽，依然独占一行，所以要设置成行内元素*/ }.search{ width: 277px; display: inline-block; float: left; margin-left: 638px; margin-top: -36px; font-size: 13px;}.button{ background:none; background-image: url(../images/btn_srh.gif); width: 58px; height: 23px; border: none;}.text{ background: none; background-image: url(../images/srh_bg.gif); }/*顶部背景图*/#back_top{ height: 66px; width: 100%; background-image:url(../images/../images/nav_bg.gif); background-repeat: repeat-x;}/*导航栏*/.back_a{ float: left; height: 66px; width: 4px; background:url(../images/../images/nav_bg.gif) no-repeat; background-position: 0 33%; overflow: hidden;}.back_b{ height: 66px; width: 4px; background:url(../images/../images/nav_bg.gif) no-repeat; background-position: -6px -66px; overflow: hidden; float: right;}.back_one ul li{ list-style: none; float: left; margin: 7px 25px; }.back_one ul li a{ text-decoration: none; color: white; font-weight:bold;}.back_one ul li a span{ background-image: url(../images/../images/nav_bg.gif); overflow: hidden; background-position: -2px -132px; color: #000000; text-align: center; display: inline-block; height: 30px; width: 94px; }.back_two ul li{ font-size: 12px; list-style: none; float: left; margin-left: 29px; margin-top: 6px;}.back_two ul{ position: absolute; /* 添加absoulute目的是脱离文本流，不受上层影响*/ top: 35px;}/*中部部内*/.content_left{ height: 255px; width: 272px; display: inline-block; float: left;}.sign_shang{ height: 39px; width: 131px; background-image: url(../images/../images/btn_login.gif); display: inline-block; float: left;}.sign_ren{ height: 39px; width: 131px; background-image: url(../images/../images/../images/btn_login1.gif); display: inline-block; float: left; margin-left: 6px; }/*上部中间*/.content_middle{ height: 255px; width: 390px; background-image: url(../images/../images/hot_bg.gif); background-repeat: no-repeat; display: inline-block; float: left; margin-left: 5px; }.content_middle .p{ font-size: 18px; font-weight: bold; text-align: center; margin-top: 15px;}.content_middle p{ font-size: 13px; margin: 15px;}.content_middle ul li{ list-style-image:url(../images/wuxu.jpg); font-size: 13px; margin:3px 36px 0;}.content_middle span{ display: inline-block; float: right; color: #7B9F11;}.content_middle a{ text-decoration: none; color: #000000;}.conten_middle .xuxian{ border: 1px #CCCCCC dashed; width: 350px; height: 80px; } /*不显示,设置边框无用*//*上部右方*/.content_right{ height: 255px; width: 230px; float: left; margin-left: 7px; background-image: url(../images/side_bg.gif); }.right_one{ height: 28px; width: 100%; line-height: 28px; margin: auto; }.right_two{ height: 74px; width: 207px; background-image: url(../images/../images/icon2.gif) ; background-repeat: no-repeat; background-position: 10px 11px; border-bottom-style:dashed; border-width: 0.1px; margin-left: 4px; font-size: 14px; }.yuyin { position: relative; top:17px; right: -62px;}.right_three{ height: 74px; width: 207px; background-image: url(../images/../images/icon2.gif) ; background-repeat: no-repeat; background-position: 10px -60px; border-bottom-style:dashed; border-width: 0.1px; margin-left: 4px; font-size: 14px; }.right_four{ height: 74px; width: 207px; background-image: url(../images/../images/icon2.gif) ; background-repeat: no-repeat; background-position: 10px -134px; margin-left: 4px; font-size: 14px; }.right_five{ height: 5px; width: 100%; background-image: url(../images/side_bg.gif); background-position: 0% 100%;}/*内容第二部分*/#content_two{ height: 630px; width: 100%; margin:auto;}.images{ border: 1px solid #DBDBDB; height: 293px; width: 660px; display: inline-block; float: left; margin-top: 10px; /*为什么之右images也浮动起来，下面的才能上来*/} .zuobian_top{ height: 30px; width: 100%; background-color: #F7F7F7; line-height: 30px; }.xiangce ul li{ list-style: none; float: left; }.xiangce ul li img{ display: block; margin:0 auto;}.xiangce ul li a{ display:block; text-align: center; margin: 20px 0px 0px 20px; text-decoration: none; color: #000000; font-size: 14px}/*企业历史左边的*/.history_left{ border: 1px solid #DBDBDB; height: 288px; width: 327px; float: left; display:inline-block; margin-top: 10px;}.history_lefttop{ height: 30px; width: 100%; background-color: #F7F7F7; line-height: 30px; background-image: url(../images/icon.gif) ;/*如何用img实现backgrondposition的效果*/ background-repeat: no-repeat; background-position: 10px 5px; overflow: hidden;}.more{ width: 70px; height: 30px; background-image: url(../images/icon.gif) ; background-repeat: no-repeat; background-position: 10px 5px; overflow: hidden; display: inline-block; float: right;}.history_leftcontent{ font-size: 13px; margin: 17px; color: #A7A3A4;}.history_leftcontent .history_apple{ margin-right: 15px; float: left;}.history_leftlist a{ text-decoration: none; color: #000000;}.history_leftlist ul li{ list-style-image:url(../images/wuxu.jpg); font-size: 13px; margin:3px 0px 3px 32px;}.history_right{ border: 1px solid #DBDBDB; height: 288px; width: 327px; float: left; display: inline-block; margin-top: 10px; margin-left: 5px;}.history_righttop{ height: 30px; width: 100%; background-color: #F7F7F7; line-height: 30px; background-image: url(../images/icon.gif) ;/*如何用img实现backgrondposition的效果*/ background-repeat: no-repeat; background-position: 10px 5px; overflow: hidden;}/*右边问答区*/.questions{ height: 434px; width: 229px; margin-top: 10px; font-size: 13px; display: inline-block; margin-left: 12px; background-image: url(../images/side_bg.gif); background-repeat: no-repeat; overflow: hidden; background-position: 0% 0%;}.que1{ font-size: 16px; height: 28px; width: 100%; line-height: 28px; margin: auto; }.que2,.que6{ margin: 5px 5px 0px 30px;}.questions ul{ list-style-image: url( ../images/wuxu.jpg); margin-bottom: 10px;}.que3{ border: 1px dashed #DCDCDC; margin: 5px 5px 0px 30px; border-left-style: hidden; border-right-style: hidden;}.que4,.que5{ border: 1px dashed #DCDCDC; margin: 5px 5px 0px 30px; border-left-style: hidden; border-right-style: hidden; border-top-style: hidden;}.que7{ background-image: url(../images/side_bg.gif); background-position: 0% 100%; margin-top: -5px; margin-left: 0px; line-height: 33px;}.iphone{ border: 1px solid #A29D9E; border-top-style: hidden; border-left-style: hidden; border-right-style: hidden; height: 142px; width: 226px; margin-left: 14px; display: inline-block; margin-top: 10px; background-image: url(../images/side_bg.gif); background-repeat: no-repeat; overflow: hidden; background-position: 0% 0%;}.iphone_top{ font-size: 16px; height: 28px; width: 100%; line-height: 28px; margin: auto;}.ipone_image{ height: 110px; width: 100%; background-image: url(../images/tel.gif);}/*顶部*/#foot{ width: 100%; height: 90px; margin-top: -13px;}.foot_top{ height: 30px; width: 100%; background-color: #AFAFAF;}.foot_top a{ text-decoration: none; line-height: 30px; text-align: center; color: white;}.foot_foot{ font-size: 13px; color: #666666；}span { color: red;}.back_two { position: relative;}