123 lines
4.3 KiB
HTML
Executable File
123 lines
4.3 KiB
HTML
Executable File
<!-- FULL HEADER BLOCK -->
|
||
<header>
|
||
|
||
<!-- BACKGROUND IMAGE -->
|
||
<div class="background-sky hero"></div>
|
||
|
||
<!-- INTRO SECTION -->
|
||
<section id="intro">
|
||
|
||
<!-- LOGO -->
|
||
<div class="hero-logo">
|
||
<img src="assets/images/logos/angular/angular.svg"/>
|
||
</div>
|
||
|
||
<!-- CONTAINER -->
|
||
<div class="homepage-container">
|
||
<div class="hero-headline no-toc">一套框架，多种平台<br>移动端 & 桌面端</div>
|
||
<a class="button hero-cta" href="guide/quickstart">快速上手</a>
|
||
</div>
|
||
</section>
|
||
|
||
</header>
|
||
|
||
<!-- MAIN CONTENT -->
|
||
<article>
|
||
|
||
<h1 class="no-toc" style="display: none"></h1>
|
||
|
||
<div class="home-rows">
|
||
|
||
<!-- Announcement Bar -->
|
||
<div class="homepage-container">
|
||
<div class="announcement-bar">
|
||
<img src="generated/images/marketing/home/angular-mix.png" height="40" width="151">
|
||
<p>2017年十月 加入我们的最新活动</p>
|
||
<a class="button" href="https://angularmix.com/">了解更多</a>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Group 1 -->
|
||
<div layout="row" layout-xs="column" class="home-row homepage-container">
|
||
<div class="promo-img-container promo-1">
|
||
<div>
|
||
<img height="222" width="340" src="generated/images/marketing/home/responsive-framework.svg" alt="responsive framework">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="text-container">
|
||
<div class="text-block promo-1-desc l-pad-top-2">
|
||
<div class="text-headline">横跨所有平台</div>
|
||
<p class="text-body">学会用Angular构建应用，然后把这些代码和能力复用在多种多种不同平台的应用上 —— Web、移动 Web、移动应用、原生应用和桌面原生应用。</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<hr>
|
||
|
||
<!-- Group 2 -->
|
||
<div layout="row" layout-xs="column" class="home-row">
|
||
<div class="text-container">
|
||
<div class="text-block">
|
||
<div class="text-headline">速度与性能</div>
|
||
<p class="text-body">通过Web Worker和服务端渲染，达到在如今(以及未来）的Web平台上所能达到的最高速度。</p>
|
||
<p class="text-body">Angular让你有效掌控可伸缩性。基于RxJS、Immutable.js和其它推送模型，能适应海量数据需求。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="promo-img-container promo-2">
|
||
<div>
|
||
<img height="222" width="323" src="generated/images/marketing/home/speed-performance.svg" alt="speed and performance">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<hr>
|
||
|
||
<!-- Group 3 -->
|
||
<div layout="row" layout-xs="column" class="home-row">
|
||
<div class="promo-img-container promo-3">
|
||
<div><img src="generated/images/marketing/home/joyful-development.svg" alt="IDE example"></div>
|
||
</div>
|
||
|
||
<div class="text-container">
|
||
<div class="text-block promo-3-desc">
|
||
<div class="text-headline">美妙的工具</div>
|
||
<p class="text-body">使用简单的声明式模板，快速实现各种特性。使用自定义组件和大量现有组件，扩展模板语言。在几乎所有的IDE中获得针对Angular的即时帮助和反馈。所有这一切，都是为了帮助你编写漂亮的应用，而不是绞尽脑汁的让代码“能用”。</p>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<hr>
|
||
|
||
<!-- Group 4 -->
|
||
<div layout="row" layout-xs="column" class="home-row">
|
||
<div class="text-container">
|
||
<div class="text-block l-pad-top-2">
|
||
<div class="text-headline">百万粉丝热捧</div>
|
||
<p class="text-body">从原型到全球部署，Angular都能带给你支撑Google大型应用的那些高延展性基础设施与技术。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="promo-img-container promo-4">
|
||
<div>
|
||
<img src="generated/images/marketing/home/loved-by-millions.svg" alt="angular on the map" width="455" height="228">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- CTA CARDS -->
|
||
<div layout="row" layout-xs="column" class="home-row">
|
||
<a href="guide/quickstart">
|
||
<div class="card">
|
||
<img src="generated/images/marketing/home/code-icon.svg" height="70px">
|
||
<div class="card-text-container">
|
||
<div class="text-headline">立即开始</div>
|
||
<p>开始构建你的 Angular 应用</p>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
|
||
</div><!-- end of home rows -->
|
||
|
||
</article>
|