如何将 CSS 包含到 IntraWeb 项目中？

Posted 2023-02-23

技术标签:

【中文标题】如何将 CSS 包含到 IntraWeb 项目中？【英文标题】：How to include CSS into a IntraWeb Project? 【发布时间】：2014-09-23 23:59:57 【问题描述】：

说明：

我通过“IntraWeb 应用程序向导”创建了一个新的独立 IntraWeb 应用程序，我在里面放置了一些带有事件的按钮和编辑，所有的东西都运行良好，但是按钮和编辑需要一些样式，因为它们很丑。

目标：

我想使用 CSS 对它们进行样式化以覆盖默认样式并添加一些新样式。

问题：

我找不到如何将 CSS 文件包含到我的项目中，以便以后在我的 TIWForm 的 StyleSheet 属性中使用它。

我的尝试：

我尝试将 css 文件手动放入“.exe 的同一文件夹”的调试文件夹中，我也尝试单击文件 -> 新建 -> 其他 -> CSS 样式表，然后粘贴 css 代码并将其保存到Debug 文件夹“与 .exe 相同的文件夹”。

我需要解决这个问题，否则我将无法使用 IntraWeb App。

【问题讨论】：

我不确定我是否理解这个问题。创建并保存 CSS 文件后，只需将 TIWForm.StyleSheet.FileName 设置为该文件的名称即可。我确实尝试在对象检查器上将我的 TIWForm 的 FileName 属性设置为我的 css 文件名，但它不起作用设置文件名确实有效，设置 URL 也是如此。您必须实际应用样式。在 Demos for Intraweb 中有一个使用自定义 .CSS 的示例。我没有为 XE6 安装 IW，但在旧版本中它位于公共文档文件夹中（Win 7 在 C:\Users\Public\Documents\RAD Studio\5.0\Demos\Intraweb\Win32 中有它）；有一个名为Features 的文件夹。如果您在该文件夹中打开项目并四处寻找，您会看到它使用名为 azweb.css 的自定义 .CSS 来设置某些内容的样式。（而且没有任何细节说“不工作”是没有意义的。）对不起“不工作”我得到的问题是找不到文件，我使用的是独立的，可能 css 文件没有部署到服务器中，但我会尝试在此处查看示例这是一个文件夹问题，我无法从这里看到您的目录结构。您放置文件的文件夹必须可供 Web 服务器（或您的应用程序）使用。无论您的 Web 根目录是什么 +/files/css，是否有一个文件夹？我不知道您将什么配置为 Web 根文件夹。现在这不是 Intraweb 问题。这是一个配置问题，我无能为力，因为我无法从这里看到您的配置。对不起。 【参考方案1】：

默认情况下，独立 IntraWeb 应用程序会在应用程序目录中查找名为 \wwwroot\ 的文件夹。 Stylesheet.Filename 路径与此文件夹相关。

要解决您的问题，只需创建..\Win32\Debug\wwwroot\ 并将您的bee.css 放入其中。然后在对象检查器中将StyleSheet.Filename 更改为bee.css。

如果您更喜欢按代码设置，可以在 onRender 事件中这样做：

procedure TIWSomeForm.IWAppFormRender(Sender: TObject); 
begin   
  Stylesheet.Filename := 'bee.css'; 
end;

如果要更改内容文件夹，可以执行以下操作：

function IWServerController: TIWServerController;
begin
  Result := TIWServerController(GServerController);
  gsc.ContentPath := 'Full\Path\Here';
end;

请注意，您需要在构造函数中执行此操作！

文档可以在这里找到：http://docs.atozed.com/docs.dll/classes/TIWServerControllerBase.html

PS：不要忘记在 Css 属性中应用您的 CSS 类。

【讨论】：

想法：不使用“..\Win32\Debug\wwwroot\”，可以通过将输出文件夹更改为更方便的文件夹来改善工作流程（我使用与主 DRPJ 相同的文件夹文件夹）。现在您不必浏览所有这些文件夹来更改 CSS 文件 :)【参考方案2】：

找到已编译的 (exe) 文件（通常位于 \Win32\Debug 中）。在那里创建一个名为“wwwroot”的文件夹，并将您的 CSS 文件放入该文件夹中。（文件夹必须有这个确切的名称。任何其他名称都不起作用！）单击您的表单并编辑 StyleSheet 属性：