html - CSS 定义在页面中分隔

Question

人们使用所见即所得来创建消息。

我无法控制在此阶段生成的字符串。我只是通过 Web 服务“获取”包括所有格式的字符串，该服务返回单个字符串。

例如，我会回来:

<p>here is the <a href='http://www.example.com'>link</a>

不幸的是，我还在同一个字符串中找回了字体定义和其他样式属性。例如

<!--
/* Font Definitions */
@font-face
    {font-family:"Cambria Math";
    panose-1:2 4 5 3 5 4 6 3 2 4;}
@font-face
    {font-family:Calibri;
    panose-1:2 15 5 2 2 2 4 3 2 4;}
@font-face
    {font-family:Tahoma;
    panose-1:2 11 6 4 3 5 4 4 2 4;}
@font-face
    {font-family:Corbel;
    panose-1:2 11 5 3 2 2 4 2 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
    {margin:0cm;
    margin-bottom:.0001pt;
    font-size:11.0pt;
    font-family:"Calibri",sans-serif;
    mso-fareast-language:EN-US;}
a:link, span.MsoHyperlink
    {mso-style-priority:99;
    color:#0563C1;
    text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
    {mso-style-priority:99;
    color:#954F72;
    text-decoration:underline;}
span.EmailStyle17
    {mso-style-type:personal-compose;
    font-family:"Calibri",sans-serif;
    color:windowtext;}
.MsoChpDefault
    {mso-style-type:export-only;
    font-family:"Calibri",sans-serif;
    mso-fareast-language:EN-US;}
@page WordSection1
    {size:612.0pt 792.0pt;
    margin:72.0pt 72.0pt 72.0pt 72.0pt;}
div.WordSection1
    {page:WordSection1;}
-->

很明显，这会改变整个页面的格式，而不仅仅是使用所见即所得创建的消息，因为它定义了 HTML 标签，而不是使用实际的类或 ID。

是否有可能以某种方式分离页面，以便其中的任何 CSS 定义仅适用于该 HTML block ？或者我是否必须将它放入带有 ID 的 div block 中，并以某种方式遍历返回的字符串(包含样式元素)并将任何定义更新为该 ID 的子项？即，我需要将其呈现为 #exampleID a:visited

而不是 a:visited

如果我需要做后者，有人对解决这个问题的最佳方法有任何想法吗？

谢谢大家。这只是我的第二个问题，并且仍在学习发布这些问题的正确方法。因此，请询问您认为我遗漏的任何信息，并将更新帖子。

Answer 1

Is it possible to somehow separate the page so that any CSS definition inside that only applies to that HTML block?

在 iframe 中呈现它。不幸的是 proper alternative has no support whatsoever in current browsers .