回到所有的课程
课程库

使用段落元素可以添加、样式和格式化内联文本。

这个视频的特点是一个旧的UI。更新版本即将发布!

当您想要向项目中添加较长的文本块时,您可以选择使用段落元素或富文本元素.在这里,我们将讨论所有你需要知道的段落。

在这节课中:
  1. 添加段落
  2. 样式的段落
  3. 调整段落之间的间距
  4. 格式化和样式内联文本

添加段落

段图标缩略图

元素中添加一个段落元素元素面板(快捷方式:A).默认情况下,段落元素包含一个占位符文本块。您可以通过在内容中键入或粘贴来双击、选择并替换里面的文本。还可以通过选择元素并按回车键进入文本编辑模式。

用lorem ipsum文本填充的段落元素。

添加多个段落

您可能需要向页面的一个部分添加多个段落。尽管你可以通过输入来实现输入在一个段落元素的段落之间,更好的做法是为每个段落使用单独的段落元素。这样可以更好地控制间距。与富文本元素按回车键可以很容易地添加多个段落。

样式的段落

有很多方法来塑造段落的风格。您可以创建一个惟一的类,并在样式类似的段落中重用这个类。你可以一次设置所有段落元素的样式,然后让它保持原样。或者你可能想在Body上设置样式,让段落继承这些样式。

使用类进行样式化

您可以通过选择段落并在样式面板中更改样式来设置段落元素的样式。这些更改将保存在类名下。你也可以将这个类应用到其他段落中:

  1. 选择你想要造型
  2. 点击进入选择字段
  3. 输入相同的类名
  4. 新闻输入
  5. 样式的段落
选择器字段显示一个名为Bigger段落的活动类

样式化所有段落标记

启动项目的最好方法是设置All段落标签的样式,它保存了项目中所有段落的默认样式:

  1. 选择一个段落
  2. 点击进入选择字段
  3. 选择所有的段落
  4. 定制您的风格
单击选择器字段,显示一个下拉菜单,其中包含新类、HTML标记和现有类。

样式化Body标签上的文本

但是,您可能希望为所有文本元素(包括段落)指定字体样式,比如字体族和字体大小。要在整个项目中设置默认的排版样式,你需要编辑Body (All Pages)标签:

  1. 选择身体元素
  2. 点击进入选择字段
  3. 选择身体(所有页)
  4. 自定义排版样式
左边的第一步,从导航器中选择body元素。在右侧的第二步,选择Selector字段下拉菜单中的HTML标记部分下的Body(所有页面)类。突出显示了这两个元素。

调整段落之间的间距

当你有单独的段落元素时,你可以使用margin属性来调整这些元素之间的间距:

  1. 选择一个
  2. 点击进入选择字段
  3. 选择所有的段落
  4. 添加底部空白
左边的第一步,选择HTML Tag下的All段落类。在右边的第二步,在样式面板的间距部分为段落添加底部空白。

当你只需要调整几个段落的间距时,你可以应用.现在,对这个类所做的样式更改将应用于具有这个相同类的段落。

格式化和样式内联文本

在某些情况下,您可能希望在段落元素中设置部分文本的样式。例如,您可能想要斜体化一个单词,或添加到一个短语的链接,甚至在一个句子下划线。您可以使用双击段落元素时出现的文本格式栏来实现这一点。

iterdum一词在段落文本中突出显示。文本格式栏悬停在单词上方,有5个文本格式选项,粗体、斜体、插入链接、跨换行和清晰格式。

了解关于内联文本格式的更多信息。

尝试Webflow——它是免费的
Baidu
map