回到所有的课程
课程库

使用段落元素添加内联文本、设置内联文本的样式和格式。

本视频采用了旧的用户界面。更新版本即将到来!

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

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

添加段落

段图标缩略图

控件中添加段落元素元素面板默认情况下,段落元素包含一个占位符文本块。您可以通过键入或粘贴内容来双击、选择并替换其中的文本。也可以通过选择元素并按enter键进入文本编辑模式。

一个段落元素,它充满了文本。

添加多个段落

您可能需要在页面的一个部分中添加多个段落。尽管你可以通过打字来完成输入在一个段落元素中的段落之间,更好的做法是为每个段落使用单独的段落元素。这使您能够更好地控制间距。与富文本元素按enter键可以轻松添加多个段落。

样式的段落

有很多方法来设计段落的风格。您可以创建一个惟一的类,并为类似样式的段落重用这个类。你可以一次设置所有段落元素的样式,然后就不去管它了。或者,您可能希望在Body上设置样式,并让段落继承这些样式。

使用类设置样式

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

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

设置所有段落标签的样式

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

  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段落类。在右边的第二步,在样式面板的Spacing部分添加段落的底部空白。

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

内联文本的格式和样式

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

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

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

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