用html和css写一个头部header和左侧菜单栏menu-bar固定的的页面
这个页面header部分是100%的宽度，60px的高度，左侧是刚好一屏的高度，180的宽度，右侧的部分把剩余的空间占满，刚开始的时候还没怎么接触这样的页面，以为使用js读取浏览的可视化宽高，然后在做计算，但是因为后面做的页面需要自适应屏幕的大小而发生变化，于是我用了jquery中的$(window).resize()方法，当屏幕出现各种各样的大小或者以各种方式打开浏览器的时候会出现很多问题，很多时候当屏幕很小的打开页面的时候，页面是乱的，刷新一次之后，才恢复正常。后来我发现这种方式实不可取的，这样的页面最好不要用js来计算，后面找啊找，我发现了一个css3中的属性，可以用calc()来计算一些宽高之类的，但是这个属性在低版本的IE下面是不被支持的，最后经过研究之后，可以通过定位来实现这样的页面。下面附上代码。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
html,body{
width: 100%;
height: 100%;
}
*{
margin: 0;
padding: 0;
}
.header{
width: 100%;
height: 60px;
position: fixed;
top: 0;
left: 0;
background: #ddd;
z-index: 100;
}
.content{
position: relative;
width: 100%;
height: 100%;
left: 0;
overflow: hidden;
}
.cnt-lf{
position: absolute;
width: 180px;
height: 100%;
top: 60px;
left: 0;
background: orange;
}
.cnt-rg{
min-width: 900px;
padding-top: 60px;
padding-left: 200px;
}
.cnt-box{
height: 100%;
overflow: auto;
}
</style>
</head>
<body>
<div class="header"></div>
<div class="content">
<div class="cnt-lf">
<div class="tp" style="width: 100%;height: 50%;background: red;"></div>
<div class="tp" style="width: 100%;height: 50%;background: black;"></div>
</div>
<div class="cnt-box">
<div class="cnt-rg">5154512112545445112454545
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum perferendis rem rerum quod neque reprehenderit vitae quia dignissimos natus harum voluptas commodi dolore hic assumenda dolorem eum, ab nobis nesciunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Obcaecati tenetur architecto tempora atque aperiam minus et impedit expedita perferendis. Reiciendis id, modi cumque explicabo, similique officia magnam aspernatur necessitatibus numquam!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores modi, fugiat inventore dolores quam laboriosam eligendi pariatur laborum, excepturi odio et autem dolorem ullam, exercitationem hic soluta. Aspernatur, recusandae, maxime.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium tenetur, minima dolorum. Ut praesentium dolor, tenetur quia fuga numquam consectetur! Excepturi recusandae, consectetur illum. Velit, odit, dolorum. Sint, incidunt, totam?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui porro officia numquam temporibus, labore ipsum consequatur sapiente, amet suscipit mollitia culpa quia. Illum quasi officiis adipisci, suscipit vero ratione eaque.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam temporibus animi, ut, nam unde deleniti veniam! Sed illo, quia, animi error quae natus vel alias rerum voluptates neque, perspiciatis sunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum perferendis rem rerum quod neque reprehenderit vitae quia dignissimos natus harum voluptas commodi dolore hic assumenda dolorem eum, ab nobis nesciunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Obcaecati tenetur architecto tempora atque aperiam minus et impedit expedita perferendis. Reiciendis id, modi cumque explicabo, similique officia magnam aspernatur necessitatibus numquam!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores modi, fugiat inventore dolores quam laboriosam eligendi pariatur laborum, excepturi odio et autem dolorem ullam, exercitationem hic soluta. Aspernatur, recusandae, maxime.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium tenetur, minima dolorum. Ut praesentium dolor, tenetur quia fuga numquam consectetur! Excepturi recusandae, consectetur illum. Velit, odit, dolorum. Sint, incidunt, totam?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui porro officia numquam temporibus, labore ipsum consequatur sapiente, amet suscipit mollitia culpa quia. Illum quasi officiis adipisci, suscipit vero ratione eaque.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam temporibus animi, ut, nam unde deleniti veniam! Sed illo, quia, animi error quae natus vel alias rerum voluptates neque, perspiciatis sunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum perferendis rem rerum quod neque reprehenderit vitae quia dignissimos natus harum voluptas commodi dolore hic assumenda dolorem eum, ab nobis nesciunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Obcaecati tenetur architecto tempora atque aperiam minus et impedit expedita perferendis. Reiciendis id, modi cumque explicabo, similique officia magnam aspernatur necessitatibus numquam!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores modi, fugiat inventore dolores quam laboriosam eligendi pariatur laborum, excepturi odio et autem dolorem ullam, exercitationem hic soluta. Aspernatur, recusandae, maxime.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium tenetur, minima dolorum. Ut praesentium dolor, tenetur quia fuga numquam consectetur! Excepturi recusandae, consectetur illum. Velit, odit, dolorum. Sint, incidunt, totam?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui porro officia numquam temporibus, labore ipsum consequatur sapiente, amet suscipit mollitia culpa quia. Illum quasi officiis adipisci, suscipit vero ratione eaque.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam temporibus animi, ut, nam unde deleniti veniam! Sed illo, quia, animi error quae natus vel alias rerum voluptates neque, perspiciatis sunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum perferendis rem rerum quod neque reprehenderit vitae quia dignissimos natus harum voluptas commodi dolore hic assumenda dolorem eum, ab nobis nesciunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Obcaecati tenetur architecto tempora atque aperiam minus et impedit expedita perferendis. Reiciendis id, modi cumque explicabo, similique officia magnam aspernatur necessitatibus numquam!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores modi, fugiat inventore dolores quam laboriosam eligendi pariatur laborum, excepturi odio et autem dolorem ullam, exercitationem hic soluta. Aspernatur, recusandae, maxime.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium tenetur, minima dolorum. Ut praesentium dolor, tenetur quia fuga numquam consectetur! Excepturi recusandae, consectetur illum. Velit, odit, dolorum. Sint, incidunt, totam?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui porro officia numquam temporibus, labore ipsum consequatur sapiente, amet suscipit mollitia culpa quia. Illum quasi officiis adipisci, suscipit vero ratione eaque.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam temporibus animi, ut, nam unde deleniti veniam! Sed illo, quia, animi error quae natus vel alias rerum voluptates neque, perspiciatis sunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum perferendis rem rerum quod neque reprehenderit vitae quia dignissimos natus harum voluptas commodi dolore hic assumenda dolorem eum, ab nobis nesciunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Obcaecati tenetur architecto tempora atque aperiam minus et impedit expedita perferendis. Reiciendis id, modi cumque explicabo, similique officia magnam aspernatur necessitatibus numquam!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores modi, fugiat inventore dolores quam laboriosam eligendi pariatur laborum, excepturi odio et autem dolorem ullam, exercitationem hic soluta. Aspernatur, recusandae, maxime.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium tenetur, minima dolorum. Ut praesentium dolor, tenetur quia fuga numquam consectetur! Excepturi recusandae, consectetur illum. Velit, odit, dolorum. Sint, incidunt, totam?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui porro officia numquam temporibus, labore ipsum consequatur sapiente, amet suscipit mollitia culpa quia. Illum quasi officiis adipisci, suscipit vero ratione eaque.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam temporibus animi, ut, nam unde deleniti veniam! Sed illo, quia, animi error quae natus vel alias rerum voluptates neque, perspiciatis sunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum perferendis rem rerum quod neque reprehenderit vitae quia dignissimos natus harum voluptas commodi dolore hic assumenda dolorem eum, ab nobis nesciunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Obcaecati tenetur architecto tempora atque aperiam minus et impedit expedita perferendis. Reiciendis id, modi cumque explicabo, similique officia magnam aspernatur necessitatibus numquam!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores modi, fugiat inventore dolores quam laboriosam eligendi pariatur laborum, excepturi odio et autem dolorem ullam, exercitationem hic soluta. Aspernatur, recusandae, maxime.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium tenetur, minima dolorum. Ut praesentium dolor, tenetur quia fuga numquam consectetur! Excepturi recusandae, consectetur illum. Velit, odit, dolorum. Sint, incidunt, totam?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui porro officia numquam temporibus, labore ipsum consequatur sapiente, amet suscipit mollitia culpa quia. Illum quasi officiis adipisci, suscipit vero ratione eaque.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam temporibus animi, ut, nam unde deleniti veniam! Sed illo, quia, animi error quae natus vel alias rerum voluptates neque, perspiciatis sunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum perferendis rem rerum quod neque reprehenderit vitae quia dignissimos natus harum voluptas commodi dolore hic assumenda dolorem eum, ab nobis nesciunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Obcaecati tenetur architecto tempora atque aperiam minus et impedit expedita perferendis. Reiciendis id, modi cumque explicabo, similique officia magnam aspernatur necessitatibus numquam!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores modi, fugiat inventore dolores quam laboriosam eligendi pariatur laborum, excepturi odio et autem dolorem ullam, exercitationem hic soluta. Aspernatur, recusandae, maxime.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium tenetur, minima dolorum. Ut praesentium dolor, tenetur quia fuga numquam consectetur! Excepturi recusandae, consectetur illum. Velit, odit, dolorum. Sint, incidunt, totam?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui porro officia numquam temporibus, labore ipsum consequatur sapiente, amet suscipit mollitia culpa quia. Illum quasi officiis adipisci, suscipit vero ratione eaque.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam temporibus animi, ut, nam unde deleniti veniam! Sed illo, quia, animi error quae natus vel alias rerum voluptates neque, perspiciatis sunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum perferendis rem rerum quod neque reprehenderit vitae quia dignissimos natus harum voluptas commodi dolore hic assumenda dolorem eum, ab nobis nesciunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Obcaecati tenetur architecto tempora atque aperiam minus et impedit expedita perferendis. Reiciendis id, modi cumque explicabo, similique officia magnam aspernatur necessitatibus numquam!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores modi, fugiat inventore dolores quam laboriosam eligendi pariatur laborum, excepturi odio et autem dolorem ullam, exercitationem hic soluta. Aspernatur, recusandae, maxime.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium tenetur, minima dolorum. Ut praesentium dolor, tenetur quia fuga numquam consectetur! Excepturi recusandae, consectetur illum. Velit, odit, dolorum. Sint, incidunt, totam?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui porro officia numquam temporibus, labore ipsum consequatur sapiente, amet suscipit mollitia culpa quia. Illum quasi officiis adipisci, suscipit vero ratione eaque.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam temporibus animi, ut, nam unde deleniti veniam! Sed illo, quia, animi error quae natus vel alias rerum voluptates neque, perspiciatis sunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum perferendis rem rerum quod neque reprehenderit vitae quia dignissimos natus harum voluptas commodi dolore hic assumenda dolorem eum, ab nobis nesciunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Obcaecati tenetur architecto tempora atque aperiam minus et impedit expedita perferendis. Reiciendis id, modi cumque explicabo, similique officia magnam aspernatur necessitatibus numquam!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores modi, fugiat inventore dolores quam laboriosam eligendi pariatur laborum, excepturi odio et autem dolorem ullam, exercitationem hic soluta. Aspernatur, recusandae, maxime.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium tenetur, minima dolorum. Ut praesentium dolor, tenetur quia fuga numquam consectetur! Excepturi recusandae, consectetur illum. Velit, odit, dolorum. Sint, incidunt, totam?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui porro officia numquam temporibus, labore ipsum consequatur sapiente, amet suscipit mollitia culpa quia. Illum quasi officiis adipisci, suscipit vero ratione eaque.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam temporibus animi, ut, nam unde deleniti veniam! Sed illo, quia, animi error quae natus vel alias rerum voluptates neque, perspiciatis sunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum perferendis rem rerum quod neque reprehenderit vitae quia dignissimos natus harum voluptas commodi dolore hic assumenda dolorem eum, ab nobis nesciunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Obcaecati tenetur architecto tempora atque aperiam minus et impedit expedita perferendis. Reiciendis id, modi cumque explicabo, similique officia magnam aspernatur necessitatibus numquam!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores modi, fugiat inventore dolores quam laboriosam eligendi pariatur laborum, excepturi odio et autem dolorem ullam, exercitationem hic soluta. Aspernatur, recusandae, maxime.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium tenetur, minima dolorum. Ut praesentium dolor, tenetur quia fuga numquam consectetur! Excepturi recusandae, consectetur illum. Velit, odit, dolorum. Sint, incidunt, totam?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui porro officia numquam temporibus, labore ipsum consequatur sapiente, amet suscipit mollitia culpa quia. Illum quasi officiis adipisci, suscipit vero ratione eaque.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam temporibus animi, ut, nam unde deleniti veniam! Sed illo, quia, animi error quae natus vel alias rerum voluptates neque, perspiciatis sunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum perferendis rem rerum quod neque reprehenderit vitae quia dignissimos natus harum voluptas commodi dolore hic assumenda dolorem eum, ab nobis nesciunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Obcaecati tenetur architecto tempora atque aperiam minus et impedit expedita perferendis. Reiciendis id, modi cumque explicabo, similique officia magnam aspernatur necessitatibus numquam!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores modi, fugiat inventore dolores quam laboriosam eligendi pariatur laborum, excepturi odio et autem dolorem ullam, exercitationem hic soluta. Aspernatur, recusandae, maxime.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium tenetur, minima dolorum. Ut praesentium dolor, tenetur quia fuga numquam consectetur! Excepturi recusandae, consectetur illum. Velit, odit, dolorum. Sint, incidunt, totam?</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Qui porro officia numquam temporibus, labore ipsum consequatur sapiente, amet suscipit mollitia culpa quia. Illum quasi officiis adipisci, suscipit vero ratione eaque.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam temporibus animi, ut, nam unde deleniti veniam! Sed illo, quia, animi error quae natus vel alias rerum voluptates neque, perspiciatis sunt.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum perferendis rem rerum quod neque reprehenderit vitae quia dignissimos natus harum voluptas commodi dolore hic assumenda dolorem eum, ab nobis nesciunt.</p>
的撒旦法师法师法 暗示法师法师是是是是是是是是是是是是是是是是
</div>
</div>
</div>
</body>
</html>
用html和css写一个头部header和左侧菜单栏menu-bar固定的的页面的更多相关文章
- 还在为小三角形切图？使用纯CSS写一个简单的三角形
同学们,当美工给的设计图是这样: 或者这样: 我的内心其实是拒绝的-_-:但工作还得干,大部分同学会写 <style> .icon{width:20px;height:20px;displ ...
- 玩玩CSS,写一个图标堆叠效果
遇到有人问如下效果怎么写,一时兴起,自己写一个玩玩. 看到这个样子,首先应该考虑一下 DOM 结构,以我的观点,把DOM结构设计为如下形式: <div> <img src=" ...
- CSS写一个圣诞树Chrome浏览器小插件
一时兴起,突然想写一个Chrome浏览器插件,不知道写啥,就写了一个圣诞树小插件.项目源码>> Chrome浏览器插件 Chrome浏览器插件最主要的是:index.html.manife ...
- 纯css写一个大太阳的天气图标
效果 效果图如下 实现思路 div实现太阳的一条矩形光影 before伪元素制作另一条光影矩形,和已有的转变90° after伪元素画个圆实现太阳样式 dom结构 用两个嵌套的div容器,父容器来 ...
- 如何用css写一个带斜切角、有边框又有内外阴影的按钮呢？
如果有一天,UI设计师丢过来一张UI稿,上面有这样一个带有斜切角.有边框还有内外阴影的按钮,你会怎么实现呢?第一反应切图?可是按钮内容.大小都是可变的,那得切多少图啊~Canvas?SVG?No,no ...
- Java-Web 用html和css写一个EasyMall注册界面
要求: html代码: <!DOCTYPE html> <html> <head> <title>EasyMall注册页面</title> ...
- 用html，CSS 写一个静态的博客网页
<!doctype html> <html> <br/><br/><br/> <head> <meta http-equi ...
- css 写一个向右的箭头
经常写移动端页面时会用到向右的箭头,之前都是用图片,突然想到用css应该也能写,于是一搜还确实有 width: 7px; height: 7px; border-top: 2px solid #fff ...
- css写一个梯形
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>D ...
随机推荐
- 真实项目中 ThreadLocal 的妙用
一.什么是 ThreadLocal ThreadLocal 提供了线程的局部变量,每个线程都可以通过 set() 和 get() 来对这个局部变量进行操作,但不会和其他线程的局部变量冲突,实现了线程间 ...
- javascript中bind绑定接收者与函数柯里化
如果我要遍历一个数组, 我只要给forEach传一个匿名函数即可,很简单: let arr = ['a', 'b', 'c']; arr.forEach((item, index) => { c ...
- IDEA为新手专业打造
IDEA为新手专业打造 一.创建一个项目 新手的话可以先创建一个空项目 项目创建完成后会弹出一个Project Settings设置框,点击Project进行如图设置,设置完成点击OK 一.在创建的项 ...
- 关于Keepalive的那些事
服务端很多同学包括自己对keepalive理解不清晰,经常搞不清楚,TCP也有keepalive,HTTP也有keepalive,高可用也叫keepalive,经常混淆这几个概念.做下这几个概念的简述 ...
- STM32F072从零配置工程-建立工程文件
快速建立工程有两种方法: 第一种是通过官方提供的外设库来搭建,好处是使用库函数,而不需要深入研究寄存器配置: 第二种是通过STM32CubeMX,好处是直观快速,可以直接帮你配置好功能和时钟,不过使用 ...
- java学习笔记(基础篇)—抽象与接口的区别
抽象与接口的区别 一.抽象(abstract) 1. 抽象方法 1) 作用:定义规范 2) 抽象方法用来描述具有什么功能,但不提供实现. 3) 如果类中一个方法没有实现就要定义一个抽象方法. 2. 抽 ...
- 【字符串】P2084 进制转换-C++
题目描述 今天小明学会了进制转换,比如(10101)2 ,那么它的十进制表示的式子就是 : 1*2^4+0*2^3+1*2^2+0*2^1+1*2^0, 那么请你编程实现,将一个M进制的数N转换成十进 ...
- 「PowerBI」分析服务多维数据结构重回关系数据库的一大绝招
在过往Excel催化剂定位的轻量级Excel+PowerBIDesktop的解决方案中,已经做过了近乎完美的PowerBIDesktop数据模型数据导出到Excel工作表的应用,这也是个人版数据应用的 ...
- c语言进阶12-线性表之顺序表
一. 线性表的定义 为什么要学习线性表呢? 因为我们日常生活中存在种数据关系,计算机程序是为了解决日常生活的数据关系,因此我们要学习线性表. 线性表是什么呢? 线性表是由n个元素组成的有限序列. 需 ...
- eclipse(javaee windows)
百度云:链接:http://pan.baidu.com/s/1eSoO4s6 密码:54am 官方下载网址:http://www.eclipse.org/downloads/eclipse-pac ...