样式化 <script> 生成的内容答案

【问题标题】：Styling a <script> generated content样式化 <script> 生成的内容
【发布时间】：2017-04-28 11:49:18
【问题描述】：

我正在尝试通过将此脚本添加到页面来设置插入到页面中的类widgetcontainer：

<script type="text/javascript" src="http://widget.ratings.food.gov.uk/fhrswidget.jss?FHRSID=12345&Culture=en-GB"?</script>

编辑：这是脚本下方页面上生成的代码..

<div id="CoreJsBaseDiv" class="widgetwrapper">
  <div class="widget1" classname="widget1">
     <div class="widget2" classname="widget2">
       <div class="widget3" classname="widget3">
          <div id="eventList" class="widgetcontainer" classname="widgetcontainer"><div>
          <a title="The Family Pizza Company" href="http://ratings.food.gov.uk/business/624197" class="listhyperlink" classname="listhyperlink">
            <div>The Family Pizza Company</div>
          </a>
          <div>CO14 8AW</div>
          <div>
             <img src="http://ratings.food.gov.uk/images/scores/small/fhrs_5_en-gb.JPG">
          </div>
        </div>
     </div>
    <br></div>
  </div>
 </div>

当我将样式添加到我的 CSS 到 .widgetcontainer 时它不起作用，我想知道是否有办法通过一些巧妙的编码来设置这个元素的样式？

【问题讨论】：

仅发布脚本标签行不足以让别人帮助您。发布呈现的 HTML 和您正在尝试的 CSS。
I can't reproduce the problem.
对不起，我已经编辑了帖子
像这样使用父类添加样式.widgetwrapper .widgetcontainer{}
在谷歌浏览器中使用“检查元素”，它会显示正在应用的样式。如果您尝试为已经应用了样式的东西设置样式，那么您需要确保正确定位它。

标签： css styling

【解决方案1】：

很可能某些东西必须覆盖您的样式。（请注意，您的脚本标签缺少 > 结尾，而 src 有错字，引号后以 ? 结尾）：

<script type="text/javascript" src="http://widget.ratings.food.gov.uk/fhrswidget.jss?FHRSID=12345&Culture=en-GB"?</script>

应该是这样的：

<script type="text/javascript" src="http://widget.ratings.food.gov.uk/fhrswidget.jss?FHRSID=12345&Culture=en-GB"></script>

对于样式覆盖，您可以尝试几种方法：

尝试通过 ID #eventList {property: value;} 影响
尝试更具体的选择器，例如 div.widgetwrapper div.widgetcontainer {property: value;}，如果需要，可以尝试更具体的选择器，例如div.widgetwrapper div.widget1 div.widget2 div.widget3 div.widgetcontainer {property: value;}
只能作为最后一种选择，您可以使用!important：.widgetcontainer {property: value !important;}

【讨论】：