html - 如何在 JSP 上分离内容层和表示层？

Question

我最近开始为网站制作一些用户界面。我目前使用的东西叫做 Bootstrap，它很容易上手并且看起来不错。但是背后的想法似乎不太有效，因为我们正在使我们的 jsp 代码（内容）依赖于这样的 css 元素：

<tr class="row col-m-7">
  <td class="column"> ... 
      <a class="btn btn-xs btn-success"> .. </a>
  </td>
  <td class="column"> ... </td>
</tr>

最近 Bootstrap 引入了一个更新的版本（v3），我不得不更改许多类属性，直到 jsp 看起来稳定。我想将代码保存在不同的层中，这样我就可以轻松地切换我的 UI 框架而不会丢失任何内容：

内容（简单的 html 或 jstl）：

   <tr>
      <td>...
      <td>...
    </tr>

介绍：

    .. somehow achieving giving a good look to the table above .. (how ???)

如何在 JSP 上分离内容层和表示层？

score 2 · Accepted Answer

更新

正在开发一种名为Web Components的新标准，它将使开发人员能够创建自定义 html 元素，这些元素隐藏了样式和内部 html 标记的实现。例如，模态小部件可以通过以下语法声明：

<bootstrap-modal>
    <h1>Hello World!</h1>
</bootstrap-modal>

在幕后，开发人员已经指定了用于呈现小部件的实际 html 标记，该实现与自定义组件相关联。

这里有一些教程可以帮助您入门：

如果所有<a>元素看起来都一样，那么您可以编写一个 css 类，并且所有<a>元素都将具有相同的样式：

a {
    color:blue;
}

一些网站，无论出于何种原因，甚至可能涉及属性值；href将需要不同<a>元素的不同颜色和样式。实现这一点的唯一方法是使用class引用样式表中的 css 类的属性：

a.red {
    color:red;
}

<a class="red" href="red.html"/>

这意味着，如果您想为相同的元素名称提供独特的样式，您将始终需要编写将表示元素和样式链接在一起的代码。

1 回答 1