mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-15 17:19:11 +08:00
119 lines
3.8 KiB
Markdown
119 lines
3.8 KiB
Markdown
---
|
|
order: 2
|
|
title:
|
|
zh-CN: 标题与段落
|
|
en-US: Title and Paragraph
|
|
debug: true
|
|
---
|
|
|
|
## zh-CN
|
|
|
|
展示标题与段落的组合。
|
|
|
|
## en-US
|
|
|
|
Display the title and paragraph.
|
|
|
|
```tsx
|
|
import { Typography } from 'antd';
|
|
import React from 'react';
|
|
|
|
const { Title, Paragraph, Text } = Typography;
|
|
|
|
const App: React.FC = () => (
|
|
<>
|
|
<Title>Introduction</Title>
|
|
<Paragraph>
|
|
In the process of internal desktop applications development, many different design specs and
|
|
implementations would be involved, which might cause designers and developers difficulties and
|
|
duplication and reduce the efficiency of development.
|
|
</Paragraph>
|
|
<Paragraph>
|
|
After massive project practice and summaries, Ant Design, a design language for background
|
|
applications, is refined by Ant UED Team, which aims to
|
|
<Text strong>
|
|
uniform the user interface specs for internal background projects, lower the unnecessary
|
|
cost of design differences and implementation and liberate the resources of design and
|
|
front-end development
|
|
</Text>.
|
|
</Paragraph>
|
|
<Title level={2}>Guidelines and Resources</Title>
|
|
<Paragraph>
|
|
We supply a series of design principles, practical patterns and high quality design resources
|
|
(<Text code>Sketch</Text> and <Text code>Axure</Text>), to help people create their product
|
|
prototypes beautifully and efficiently.
|
|
</Paragraph>
|
|
|
|
<Paragraph>
|
|
<ul>
|
|
<li>
|
|
<a href="/docs/spec/proximity">Principles</a>
|
|
</li>
|
|
<li>
|
|
<a href="/docs/pattern/navigation">Patterns</a>
|
|
</li>
|
|
<li>
|
|
<a href="/docs/resource/download">Resource Download</a>
|
|
</li>
|
|
</ul>
|
|
</Paragraph>
|
|
|
|
<Title id="intro">介绍</Title>
|
|
<Paragraph>
|
|
蚂蚁的企业级产品是一个庞大且复杂的体系。这类产品不仅量级巨大且功能复杂，而且变动和并发频繁，常常需要设计与开发能够快速的做出响应。同时这类产品中有存在很多类似的页面以及组件，可以通过抽象得到一些稳定且高复用性的内容。
|
|
</Paragraph>
|
|
<Paragraph>
|
|
随着商业化的趋势，越来越多的企业级产品对更好的用户体验有了进一步的要求。带着这样的一个终极目标，我们（蚂蚁金服体验技术部）经过大量的项目实践和总结，逐步打磨出一个服务于企业级产品的设计体系
|
|
Ant Design。基于<Text mark>『确定』和『自然』</Text>
|
|
的设计价值观，通过模块化的解决方案，降低冗余的生产成本，让设计者专注于
|
|
<Text strong>更好的用户体验</Text>。
|
|
</Paragraph>
|
|
<Title level={2}>设计资源</Title>
|
|
<Paragraph>
|
|
我们提供完善的设计原则、最佳实践和设计资源文件（<Text code>Sketch</Text> 和
|
|
<Text code>Axure</Text>），来帮助业务快速设计出高质量的产品原型。
|
|
</Paragraph>
|
|
|
|
<Paragraph>
|
|
<ul>
|
|
<li>
|
|
<a href="/docs/spec/proximity">设计原则</a>
|
|
</li>
|
|
<li>
|
|
<a href="/docs/pattern/navigation">设计模式</a>
|
|
</li>
|
|
<li>
|
|
<a href="/docs/resource/download">设计资源</a>
|
|
</li>
|
|
</ul>
|
|
</Paragraph>
|
|
|
|
<Paragraph>
|
|
<ul>
|
|
<li>I am an unordered item</li>
|
|
<li>
|
|
I am an unordered item with an ordered sublist
|
|
<ol>
|
|
<li>I am ordered</li>
|
|
</ol>
|
|
<ul>
|
|
<li>I am unordered</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
<ol>
|
|
<li>
|
|
Ordered list item with unordered sublist
|
|
<ul>
|
|
<li>I am unordered!</li>
|
|
<li>I am also unordered!</li>
|
|
</ul>
|
|
</li>
|
|
</ol>
|
|
</Paragraph>
|
|
</>
|
|
);
|
|
|
|
export default App;
|
|
```
|