跳至正文

Lorem Ipsum 生成器

为设计和开发生成占位符文本的免费在线工具。

About Lorem Ipsum

Lorem Ipsum is placeholder text commonly used in graphic design, publishing, and web development to demonstrate the visual form of a document without relying on meaningful content.

Common Use Cases

  • Website mockups and prototypes
  • Design presentations
  • Template development
  • Content layout testing
  • Typography demonstrations

主要功能

  • 3 种单位: 单词、句子、段落
  • Lorem ipsum 开头: 传统开头短语选项
  • HTML 标签: 使用 <p><div> 标签包装
  • 灵活数量: 生成 1-100 个
  • 即时复制: 即时复制生成的文本

什么是 Lorem Ipsum?

Lorem Ipsum 是自 1500 年代以来使用的标准占位符文本。它可以让您专注于设计的视觉形式,而不被实际内容分散注意力。

原文

Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

历史

  • 起源: 西塞罗的 "de Finibus Bonorum et Malorum" (公元前 45 年)
  • 变体: 1500 年代印刷商为样本修改
  • 标准化: 1960 年代通过 Letraset 贴纸普及

生成单位

单词 (Words)

# 10 个单词
Lorem ipsum dolor sit amet consectetur adipiscing elit sed do

使用场景: 标题、按钮文本、短标签

句子 (Sentences)

# 3 个句子
Lorem ipsum dolor sit amet. Consectetur adipiscing elit sed do.
Eiusmod tempor incididunt ut labore et dolore magna.

使用场景: 说明文、标题、中等文本

段落 (Paragraphs)

# 2 个段落
Lorem ipsum dolor sit amet consectetur adipiscing elit. Sed do
eiusmod tempor incididunt ut labore. Magna aliqua enim ad minim.

Veniam quis nostrud exercitation ullamco. Laboris nisi aliquip ex
ea commodo. Duis aute irure dolor in reprehenderit.

使用场景: 正文、长内容、布局测试

HTML 标签选项

<p> 标签

<p>Lorem ipsum dolor sit amet consectetur adipiscing elit.</p>

<p>Sed do eiusmod tempor incididunt ut labore et dolore.</p>

<p>Magna aliqua enim ad minim veniam quis nostrud.</p>

使用场景: 博客、文章、通用文档

<div> 标签

<div>Lorem ipsum dolor sit amet consectetur adipiscing elit.</div>

<div>Sed do eiusmod tempor incididunt ut labore et dolore.</div>

<div>Magna aliqua enim ad minim veniam quis nostrud.</div>

使用场景: 布局组件、卡片、区域

使用案例

1. 网站模型

<article>
<h1>Article Title</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit...</p>
<p>Sed do eiusmod tempor incididunt ut labore et dolore...</p>
</article>

2. UI 原型

// React 组件
function Card() {
return (
<div className="card">
<h3>Card Title</h3>
<p>Lorem ipsum dolor sit amet...</p>
<button>Read More</button>
</div>
);
}

3. 设计模板

.hero-section {
/* 用 Lorem ipsum 确认文本长度 */
}

.paragraph {
/* 用多个段落测试布局 */
}

4. 邮件模板

<table>
<tr>
<td>
<h2>Newsletter Title</h2>
<p>Lorem ipsum dolor sit amet...</p>
</td>
</tr>
</table>

5. 印刷布局

报纸布局、杂志设计、小册子等
用于确认文本空间

编程示例

JavaScript

const words = ['lorem', 'ipsum', 'dolor', 'sit', 'amet',
'consectetur', 'adipiscing', 'elit'];

function generateWords(count) {
const result = [];
for (let i = 0; i < count; i++) {
result.push(words[Math.floor(Math.random() * words.length)]);
}
return result.join(' ');
}

function generateSentences(count) {
const sentences = [];
for (let i = 0; i < count; i++) {
const wordCount = Math.floor(Math.random() * 10) + 5;
const sentence = generateWords(wordCount);
sentences.push(sentence.charAt(0).toUpperCase() +
sentence.slice(1) + '.');
}
return sentences.join(' ');
}

function generateParagraphs(count) {
const paragraphs = [];
for (let i = 0; i < count; i++) {
const sentenceCount = Math.floor(Math.random() * 4) + 3;
paragraphs.push(generateSentences(sentenceCount));
}
return paragraphs.join('\n\n');
}

// 使用
console.log(generateWords(10));
console.log(generateSentences(3));
console.log(generateParagraphs(2));

Python

import random

WORDS = ['lorem', 'ipsum', 'dolor', 'sit', 'amet',
'consectetur', 'adipiscing', 'elit', 'sed', 'do']

def generate_words(count):
return ' '.join(random.choice(WORDS) for _ in range(count))

def generate_sentences(count):
sentences = []
for _ in range(count):
word_count = random.randint(5, 15)
sentence = generate_words(word_count)
sentences.append(sentence.capitalize() + '.')
return ' '.join(sentences)

def generate_paragraphs(count):
paragraphs = []
for _ in range(count):
sentence_count = random.randint(3, 7)
paragraphs.append(generate_sentences(sentence_count))
return '\n\n'.join(paragraphs)

# 使用
print(generate_words(10))
print(generate_sentences(3))
print(generate_paragraphs(2))

替代占位符文本

1. 非英语语言

  • 中文: "天地玄黄 宇宙洪荒..."
  • 日语: "いろはにほへと..."
  • 韩语: "다람쥐 헌 쳇바퀴에 타고파..."

2. 有趣的替代品

  • Hipster Ipsum: 嬉皮士术语
  • Bacon Ipsum: 肉类相关词汇
  • Cat Ipsum: 猫咪术语
  • Pirate Ipsum: 海盗说话

3. 有意义的文本

用实际有意义的内容测试也是好方法。

最佳实践

1. 使用适量

- 标题: 3-5 个单词
- 副标题: 5-10 个单词
- 段落: 3-5 个句子
- 正文: 3-5 个段落

2. 考虑实际内容

占位符文本应与实际内容长度相似

3. 可读性测试

用不同长度的文本确认布局

4. 最终替换

发布前将所有 Lorem Ipsum 替换为实际内容

注意事项

  1. SEO: Lorem Ipsum 对 SEO 无帮助
  2. 可访问性: 可能会使屏幕阅读器用户感到困惑
  3. 生产环境: 不要在实际服务中使用
  4. 内容策略: 考虑实际内容长度

常见问题

Q: Lorem Ipsum 的含义是什么?

A: 这些是拉丁语单词,但语法不完整。原意是"痛苦本身"。

Q: 为什么使用 Lorem Ipsum?

A: 有意义的内容会在评估设计时分散注意力。Lorem Ipsum 可以让您纯粹专注于视觉形式。

Q: 可以商业使用吗?

A: 可以,Lorem Ipsum 没有版权。

Q: 应该生成多少?

A: 生成与实际内容相似的数量。

相关工具


💬 这个工具对您有帮助吗?

如果您觉得 Lorem Ipsum 生成器有用,请分享给其他设计师和开发者!

隐私保护

此工具完全在浏览器客户端运行。您输入的所有数据都不会发送到服务器,仅在浏览器中处理。