如何将 css 关联到从服务器接收的 html 字符串？答案

【问题标题】：How can I associate css to html string, received from server?如何将 css 关联到从服务器接收的 html 字符串？
【发布时间】：2013-01-03 15:31:08
【问题描述】：

我正在开发一个地铁应用程序。假设我收到一个字符串 (html) 并将该字符串加载到 webview 中。如何将 .css 关联到该 html？

更新：

答案中建议的 WebViewColumnRight 是一种 android 方法；我正在开发一个地铁应用程序，c#。

【问题讨论】：

例如提供一个“html 字符串”。它是一个完整的页面（带有标题）还是只是一个 ajax 部分？
一个完整的页面也带有css参考。
好吧，那就建一个普通的网页。 JanivZ 给了你 +100 的答案。
我已经更新了问题
忽略 webview 响应，将返回的 html 字符串嵌入到您需要的 css 中，可以是或

标签： c# html css webview microsoft-metro

【解决方案1】：

正如 JanivZ 所说，一种方法是您返回的 html 字符串应该包含对所需 CSS 的引用，以便它可以自动加载。

或者您的其他选择是，您可以使用WebView.loadDataWithBaseURL

htmlData = "<link rel=\"stylesheet\" type=\"text/css\" href=\"style.css\" />" +    htmlData;
webView.loadDataWithBaseURL(baseUrl, htmlData, "text/html", "UTF-8", null);

在此之后，WebView 将能够从基本 URL 目录中找到您的 CSS 文件。如果 HTML 和 CSS 都来自同一个基本 URL，则无需在 webView.loadDataWithBaseURL 中指定 baseURL

【讨论】：

我正在使用 c# 和 xaml 开发 Metro 应用程序。不是安卓！
哦，对不起，我想我错过了您使用 Metro App 的问题中的那一部分。我的错。但我猜基本逻辑将保持不变。我的意思是你只需要连接链接引用并加载页面。
我知道，但我找不到任何有用的功能。
@Sam ... 不确定 Metro 应用程序中是否有任何此类方法。但是如果这可以解决您的问题，我找到了一篇文章。请看看这个Link

【解决方案2】：

我会说“返回的字符串”应该包含加载 css 文件所需的引用（例如下面）

<head>
<link rel="stylesheet" type="text/css" href="test.css" />
</head>

并让其中的元素引用该css文件中定义的规则。不？

【讨论】：

【解决方案3】：

如果你正在做一个WEBVIEW.NavigateToString(stringHtmlContent)，那么请注入一个

string styleSheetString = "<link rel='stylesheet' type='text/css' href='test.css' />"

strUpdatedHtmlContent = stringHtmlContent.Insert(stringHtmlContent.IndexOf("<head>",styleSheetString);

然后做

WEBVIEW.NavigateToString(strUpdatedHtmlContent)

我只是希望这会有所帮助。哦，还有一件事，请注意 css 的路径以及我刚刚从上述讨论中得出的所有内容......

【讨论】：

我认为这是唯一的方法......或者......也许将html保存在一个文件中，在一个外部目录中也放置了style.css，是解决这个问题的另一种方法。

【解决方案4】：

指向可以找到 css 文件的完整路径的外部样式表。

 <head>
    <link rel="stylesheet" type="text/css" href="full path to css file on server">
    </head>

html 附带的内部样式表，不需要依赖 css 文件

<head>
<style>
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
</style>
</head>

内联样式是一种更复杂的方式来完成内部样式表的工作（不依赖于外部 css 文件）

<p style="color:sienna;margin-left:20px">This is a paragraph.</p>

【讨论】：