如何在Iframe响应中制作内容?

时间:2014-09-05 18:12:40

标签: html wordpress forms iframe responsive-design

我不太了解iframe(从未真正使用过它们),我正在使用它在我们的某个页面上显示一个表单。目前我们正在使用wufoo表单并使用他们的嵌入代码,但是我们的seo团队发现嵌入表单是在我们不想要的东西上添加h1标签。所以我们正在把表格放到我们的服务器上。

我在此处创建了表单http://tinyurl.com/qdtfu9g

我希望表单看起来像这样(嵌入来自wufoo的代码)http://tinyurl.com/m7v833w

这是我的不良尝试http://tinyurl.com/kfvshed

我如何使iframe中的内容响应,就像他们使用嵌入代码一样。

我使用iframe的唯一原因是javascript和css文件混乱了当前的主题,所以我将它们分开。

2 个答案:

答案 0 :(得分:0)

您可以使iframe(不是内容)响应:

iframe, object, embed {
        max-width: 100%;
}

如果要删除滚动条,请添加以下设置:

frameborder='0' scrolling='no' 

如果你想在iframe中设置内容的样式,我会推荐jQuery

iframe1.$('superclass').style.border = '1px solid #000000'

iframe1.$('superclass').addClassName('border')

答案 1 :(得分:0)

你需要制作风格:" @media ..."条目。通常它们是在ccs文件中完成的。但是,如果我理解正确,您想在表单代码中手动执行此操作吗? 在这种情况下,我建议您在单独的编辑器窗口中准备它并将其复制并粘贴到表单文件之间

示例:

// min based
@media screen and (min-width: 960px) {
#divname {
color:green;
}
}

// or max based
@media screen and (max-width: 960px) {
#divname {
color:red;
}
}

通过这个你可以管理所有部分。

我认为你还没有看到他们在一个CSS中有不同的设计? 搜索@media标签并复制粘贴。