Creating Independently Scrolling Regions

DEX602 - Unit 4 Implementing Navigation and Layouts

📄 第 306 页 🎬 视频课程

课程章节介绍

让我们来聊聊如何在Salesforce中创建一个独立的滚动区域。想象一下,你有一个很长的学生列表,如果一次性全部显示出来,页面会变得非常长,用户需要不停地滚动页面才能看到所有内容。这显然不是个好主意,对吧? 所以,我们可以通过添加一个滚动条来解决这个问题。具体怎么做呢?我们可以把学生列表放在一个特定的区域里,然后给这个区域设置一个固定的高度。这样,当列表内容超过这个高度时,滚动条就会自动出现,用户就可以在这个区域内滚动查看所有学生信息了。 具体步骤是这样的: 1. ,包裹学生瓷砖,:首先,我们需要把显示学生信息的“瓷砖”(也就是每个学生的信息块)放在一个`
`标签里。这个`
`就像是一个容器,把所有的学生信息都装在里面。 2. ,设置固定高度,:接下来,我们需要给这个`
`设置一个固定的高度。你可以通过CSS来实现这一点。比如,你可以定义一个CSS类,设置`height: 300px;`,这样这个区域的高度就被固定为300像素了。 3. ,启用滚动条,:最后,为了让这个区域能够滚动,我们需要给这个`
`添加一个特殊的CSS类,叫做`slds-scrollable`。这个类是Salesforce Lightning设计系统(SLDS)提供的,它会自动为这个区域添加滚动条。 总结一下,我们通过把学生列表放在一个固定高度的`
`里,并添加`slds-scrollable`类,就可以轻松地创建一个带有滚动条的区域了。这样,用户就可以在一个小区域内滚动查看所有学生信息,而不需要滚动整个页面了。是不是很简单呢?