angular-cn/aio/content/marketing/index.html

116 lines
4.0 KiB
HTML
Executable File
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!-- 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>移动端 &amp; 桌面端</div>
<a class="button hero-cta" href="guide/quickstart">快速上手</a>
</div>
</section>
</header>
<!-- MAIN CONTENT -->
<article>
<h1 class="no-anchor no-toc" style="display: none"></h1>
<div class="home-rows">
<aio-announcement-bar></aio-announcement-bar>
<!-- 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>