HTML 和 书籍排版的 用语对照

在学到「版心居中」的概念时,突然被“版心”这个词戳中了。

觉得诶,好有意思的中文词汇啊,有一种古典美。稍微查了一下,或许和平时熟悉的名词联系起来,更方便学习吧。

古籍专业名词HTML专业名词
版心<div> 元素
行距line-height 属性
章节标题<h1>, <h2>, <h3>
段落<p> 元素
标注<sup>, <sub> 元素
段首缩进text-indent 属性
插图<img> 元素
注释<!-- 注释 -->
目录<nav> 元素
页码page-break-* CSS属性
引用<blockquote>, <q> 元素
引导字::first-letter 伪元素
字体font-family 属性
字号font-size 属性
对齐text-align 属性
断行line-break 属性
列表<ul>, <ol>, <li> 元素
表格<table>, <tr>, <td> 元素
超链接<a> 元素

古籍中的排版和HTML中的网页元素虽然有一些不同,但通过这种对比,可以更好地理解它们之间的联系和相似之处。

以下是一些示例,说明古籍排版中的专业名词与HTML中的对应元素及效果:

1. 版心和 <div> 元素:

  • 古籍排版中的版心是指页面的中心部分,用于容纳正文内容。
  • 在HTML中,可以使用<div>元素来创建一个容器,将其中的内容居中显示,类似于版心在古籍排版中的作用。

2. 章节标题 和 <h1>, <h2>, <h3>… 元素:

  • 古籍中的章节标题用于分隔不同章节的内容,通常会使用不同的字号和样式。
  • 在HTML中,可以使用<h1>, <h2>, <h3>…等标题元素来表示不同级别的标题,其样式和层次结构类似于古籍中的章节标题。

3. 段落和 <p> 元素:

  • 古籍中的段落是一组相关的句子或句子段落,用于组织文章结构。
  • 在HTML中,使用<p>元素可以表示段落,文本在每个段落之间会有自动的间距。

4. 插图和 <img> 元素:

  • 古籍中的插图指的是书中的图片或图表。
  • 在HTML中,使用<img>元素可以插入图片,通过指定图像的URL来显示图像。

5. 引用和 <blockquote>, <q> 元素:

  • 古籍中的引用是从其他来源引用的内容,通常会用特定的格式进行标注。
  • 在 HTML 中,<blockquote> 元素用于表示长引用,<q> 元素用于表示短引用,可以在引用中自动添加引号样式。

Upon learning the concept of “centered layout,” I suddenly felt a strong connection to the term “版心” (bàn xīn), which refers to the centered content in Chinese typography.

Indeed, it’s fascinating how certain Chinese terms carry a sense of classical beauty and cultural depth. Linking these terms to familiar concepts can indeed facilitate learning.

Here’s the list of specialized terms from classical Chinese typography along with their corresponding HTML terms:

Classical Chinese TypographyHTML Terminology
版心 (Centered Content)<div> Element
行距 (Line Spacing)line-height Property
章节标题 (Chapter Headings)<h1>, <h2>, <h3>… Elements
段落 (Paragraphs)<p> Element
标注 (Annotations)<sup>, <sub> Elements
段首缩进 (Indentation)text-indent Property
插图 (Illustrations)<img> Element
注释 (Footnotes)<!-- Comment -->
目录 (Table of Contents)<nav> Element
页码 (Page Numbers)page-break-* CSS Properties
引用 (Quotations)<blockquote>, <q> Elements
引导字 (Drop Caps)::first-letter Pseudo-element
字体 (Typeface)font-family Property
字号 (Font Size)font-size Property
对齐 (Alignment)text-align Property
断行 (Line Breaks)line-break Property
列表 (Lists)<ul>, <ol>, <li> Elements
表格 (Tables)<table>, <tr>, <td> Elements
超链接 (Hyperlinks)<a> Element

These examples illustrate the connection between specialized terms from classical Chinese typography and their counterparts in HTML. Although classical typography and web elements have their differences, drawing these comparisons can help you better understand the relationship and similarities between them.


了解 小匚的个人博客 的更多信息

订阅后即可通过电子邮件收到最新文章。

发表评论

了解 小匚的个人博客 的更多信息

立即订阅以继续阅读并访问完整档案。

继续阅读

了解 小匚的个人博客 的更多信息

立即订阅以继续阅读并访问完整档案。

继续阅读