双飞翼布局

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" content="content">
    <title>双飞翼布局</title>

    <style>

    *{
    margin:0;
    padding:0;
}
body{
    height: 100%;
    min-width: 300px;
}
header{
    background-color: rgb(247, 245, 245);
    height: 60px;
    line-height: 60px;
    padding-left: 6px;
}
article{
    height: 530px;
    background-color: #fff;
    font-size: 15px;
    margin:10px 0;
    overflow: hidden;
}
.mid{
    width: 100%;
    background-color: #fff;
    float:left;
    margin-bottom: -9999px;
    padding-bottom: 9999px;
}
.inner{
    margin-bottom: -9999px;
    padding-bottom: 9999px;
    margin:0 160px;
    background-color: rgb(247, 245, 245);
    line-height: 30px;
}
.inner h3{
    padding:10px 6px;
}
.inner p{
    padding: 0 6px;
}
.lef{  
    background: #ddd;
    float:left;
    width:150px;
    margin-left: -100%;
    margin-bottom: -9999px;
    padding-bottom: 9999px;
    line-height: 25px;
    text-align:left;
}
.lef p{
    margin: 10px 6px;
}
.rig{  
    background: #ddd;
    float:left;
    width:150px;
    margin-left: -150px;
    margin-bottom: -9999px;
    padding-bottom: 9999px;
    line-height: 25px;
}
.rig p{
    margin: 10px 6px;
}
footer{
    height:30px;
    background-color:#ddd;
    text-align: center;
    color:#666;
    font-size: 12px;
    line-height: 30px;
    overflow: hidden;
}

    </style>

</head>
<body>
    <!-- header -->
    <header>
        <h1>极客星球周刊</h1>
    </header>
    <!-- article -->
    <article>
        <!-- middle -->
        <div class="mid">
            <div class="inner">
                <h3>高级游戏开发</h3>
                <p>&nbsp;&nbsp;我曾参与一个小的辅助项目,当时我尽可能地把新的技能付诸实践,并尝试一些工作职责以外的事。那是一个类似于一个社交网络的 Web 应用程序,我选择了基于 Java 的 Spring 框架作为主要技术堆栈和前段的骨架。大约 4 年前,作为一个 Java 高级开发人员,我认为 Java 是最有潜力的技术。它近乎完美地实现了企业 Web 应用以及核心任务的分布式应用甚至移动应用。直到 2015 年,Java 仍然是最受欢迎而且有价值的技术.
                </p>
                <p>&nbsp;&nbsp;我记得在某个时刻,我意识到我花了很多开发时间来设计应用程序的面向对象的结构和编写样板代码。为了寻找一个解决方案,我将项目迁移到 Groovy 和 Grails 上,并试图将一个小的自己编写的双向绑定框架应用于前端。虽然情况有一点改善,但我依然觉得需要一种在前后端都更加敏捷的技术,这种技术更加适合 Web 开发。
                </p>
                <p>&nbsp;&nbsp;我记得在某个时刻,我意识到我花了很多开发时间来设计应用程序的面向对象的结构和编写样板代码。为了寻找一个解决方案,我将项目迁移到 Groovy 和 Grails 上,并试图将一个小的自己编写的双向绑定框架应用于前端。虽然情况有一点改善,但我依然觉得需要一种在前后端都更加敏捷的技术,这种技术更加适合 Web 开发。
                </p>
                <p>&nbsp;&nbsp;我尝试用一种从根本上在服务端不同于 PHP、Ruby on Rails、Python,或在客户端不同于 JQuery 或骨架的技术。幸运的是,我发现了 Node.js 和 Angular.js,通过使用 Node,我发现我的心态从“如何做事”转变为“把事情搞定”。另一方面,Angular 彻底改变了我的前端开发的方法,它大大减少了我之前使用的样板代码。但最重要的是,我意识到JavaScript和它的生态系统正在成为一个重要的事情。
                </p>
                <p>&nbsp;&nbsp;现在我根本不会考虑构建一个 Web 应用而不将 JavaScript 作为我的首选。npm 上数量惊人程序包表明 Web 已经转向 JavaScript。在这件事中,令我印象最为深刻的是,我意识到这些新技能对定义我的职业生涯的重要性;如果我想构建 Web 应用,JavaScript 及其令人惊叹的生态系统已经成为我努力学习的重点。在我负责创建的项目中,这将促使 Node,Angular 以及其它前沿的 JavaScript 技术对项目的成功起到至关重要的作用。
                </p>
            </div>
        </div>
        <!-- left -->
        <div class="lef">
            <p>随着浏览器逐渐成为未来的运行环境,最近发布的WebAssemb承诺给Web创造自身的字节码。<br>这使你在JavaScript加载其它语言写的代码,在浏览器中看到复杂的3D视频游戏或运行功能齐全的视频编辑器将变得非常普遍。<br>JavaScript 将仍然是主流web语言,但它将辅之辅之之,以WebAssembly提出的新的可能性。</p>
        </div>
        <!-- right -->
        <div class="rig">
            <p>&nbsp;&nbsp;在6月期间,我们调查了超过 20000 名 IT 专业人士,了解到他们目前正在使用的技术以及计划在未来 12 个月内将要学习的技术,具体详情请参阅我们的 Web 开发技能工资报告。</p>
        </div>
    </article>
    <!-- footer -->
    <footer>
        <span>Copyright © 2013-2016 北京优亿致远无线技术有限公司 jikexueyuan.com All Rights Reversed. 京ICP备11018032号-8 京公网安备11010802020210</span>
    </footer>
</body>
</html>
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值