CSS для применения к содержимому DIV

Question

У меня есть DIV вроде следующего:

  <td>  
    <DIV>
    <script type="text/javascript">
    // link to some js
    </script>
    </DIV>
  </td> 

.js отображает аннотацию последней статьи внутри div. Однако он отображает его в Calibri 10px.

Я хочу, чтобы любой контент внутри DIV отображался как Verdana 10px. Я использую сторонний .js, поэтому не могу его контролировать. Как заставить DIV отображать содержимое так, как я хочу?

Answer 1

Если элементы, которые добавляет Javascript, имеют свои собственные объявления стилей, вам нужно будет использовать больше Javascript для их переопределения.

В противном случае, вы должны иметь возможность дать вашему div класс, применить ваши стили к этому классу, затем они должны распространиться на любое содержимое внутри.

, например

CSS:

.myClass {
  font-family: Verdana; 
  font-size: 10px;
}

HTML:

  <td>  
    <div class="myClass">
    <script type="text/javascript">
    // link to some js
    </script>
    </div>
  </td>

Если это не сработает, измените CSS на это:

.myClass * {
  font-family: Verdana; 
  font-size: 10px;
}

Answer 2

Вы также можете попробовать что-то в своем CSS, например:

.myClass {
    font-family: Verdana !important;
    font-size: 10px !important;
}

Answer 3

Вам необходимо проверить, какие элементы генерирует JavaScript. Используйте Firebug в FireFox или «Проверить элемент» в Chrome.

Когда вы знаете элемент, укажите что-то подобное в своей таблице стилей.

body table tr td div elementOrClassNameThatYouFound {
  font: verdana 10px;
}

Answer 4

Если javascript размещает только контент, а не стиль, вы можете сделать это:

  <td>  
    <DIV style='font-family: Verdana; font-size: 10px;'>
    <script type="text/javascript">
    // link to some js
    </script>
    </DIV>
  </td>