Styling iframe

Question

Я использую отличный Jalbum, чтобы создать фотоальбом для сайта. Каждая страница сгенерированного фотоальбома - это полная веб-страница, поэтому рекомендуемым способом встраивания альбома в веб-сайт является использование iframe.

Проблема возникает, когда я хочу стилизовать изображения, содержащиеся во встроенном iframe. Если добавить правило, такие как:

img { 
    -ms-interpolation-mode: bicubic; 
} 

в моей таблице стилей, не выбрать изображения внутри фрейма. Есть ли способ выбрать элементы, содержащиеся во встроенном iframe?

Конечно, я мог бы вручную отредактировать файл CSS, созданный Jalbum, прежде чем встраивать iframe, но мне нужно было бы это делать каждый раз, когда я регенерировал альбом.

Answer 1

Вы можете использовать JavaScript-код для вставки CSS-кода в документ iframe.

Answer 2

Из моего опыта это только о том, чтобы создавать правила CSS, которые более специфичны, чем правила внутри самого iframe. это может быть достигнуто, например, давая идентификатор в IFRAME, и у которого есть внешний элемент, что делает его более конкретным (Less примеру с прямыми трансляциями врезать, что мы используем на нашей платформе):

#livestream-iframe-wrapper { 
width: 100%; 
height: 100%; 
    #livestream-viewer { 
     width: 100%; 
     height: 100%; 
     #layout0, #layout1, #layout2, #layout3 { 
      #layout4, #layout0-lsplayer, #layout1-lsplayer, #layout2-lsplayer, #layout3-lsplayer, #layout4-lsplayer { 
       width: 100%; 
       height: 100%; 
       #lsplayer { 
        width: 100% ; 
        height: 100%; 
       } 
      } 
     } 
    } 
} 

I не можете дать какую-либо конкретную информацию о том, как это сделать для вашего случая, но используйте инспектор DOM в средствах разработки браузера, чтобы проверить DOM и найти классы для переопределения.