在iframe中覆盖CSS [英] Override CSS in an iframe

问题描述

在此页面上，表单是由JotForm提供的iframe. /p>

我想使表格左对齐，并减少包含文本字段的LI元素周围的填充.

在Magento Go(托管网站的网站平台)中，我已在custom.css中输入以下代码:

iframe#40142457787864 form#40142457787864 .form-all {margin: 0 !important;}
iframe#40142457787864 form#40142457787864 .form-line {padding: 4px 0 !important;}

但是，浏览器未应用此功能.

为什么不呢?

解决方案

该表单不是iframe的后代.

这是具有自己的DOM的其他文档中的元素，该元素已加载到iframe中.

如果要设置样式，则需要编辑iframe中加载的文档的样式表，而不是包含iframe的文档.

On this page, the form is an iframe provided by JotForm.

I want to left-align the form, and reduce the padding around the LI elements that contain the text fields.

In Magento Go (the website platform hosting the website), I have entered the following code into custom.css:

iframe#40142457787864 form#40142457787864 .form-all {margin: 0 !important;}
iframe#40142457787864 form#40142457787864 .form-line {padding: 4px 0 !important;}

However, this is not being applied by the browser.

Why not?

解决方案

The form is not a descendant of the iframe.

It is an element in a different document, with its own DOM, that is loaded into the iframe.

If you want to style it, you need to edit the stylesheet for the document loaded in the iframe, not the document containing the iframe.

这篇关于在iframe中覆盖CSS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！