Стилизация фрейма

Question

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

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

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

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

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

Answer 1

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

Answer 2

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

#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%;
                 }
             }
        }
    }
}

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