这是我的代码:
<!DOCTYPE html>
<html>
<head>
<script src="JS/jquery-1.11.0.min.js"></script>
<script src="JS/bootstrap.js"></script>
<link rel="stylesheet" href="http://www.jacklmoore.com/colorbox/example4/colorbox.css" type="text/css" media="screen"/>
<link rel="stylesheet" href="CSS/bootstrap.css" type="text/css" media="screen"/>
<link rel="stylesheet" href="CSS/bootstrap-theme.css" type="text/css" media="screen"/>
</head>
<body>
<h3>External Form</h3>
<a id="test" href="javascript:void(0);" data-toggle="modal" data-target="#myWufooModal">
Please fill out my form.
</a>
<div class="modal fade" id="myWufooModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content" style="width:700px;">
<div class="modal-body">
<object type="text/html" data="https://ss88.wufoo.com/forms/rmndx1a0zzpe4m/" style="width:640px;height:730px;">
</object>
</div>
</div>
</div>
</body>
</html>
当在本地主机上运行这段代码时，它工作正常。应用我的网站时它会显示滚动条，我根据相应的 CSS 样式调整宽度，仍然保持滚动条，我可以知道如何解决这个问题吗？
最佳答案
overflow:hidden 的问题是它会隐藏表单中的详细信息，并且根据屏幕大小，不同的用户会看到不同的列数形式，因为溢出的内容已被隐藏。
我建议您使用 Media Queries 在您弹出页面并减小表单中元素的大小(读取高度)
我的建议是这样的:
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
.form-textbox, .form-textarea {
width: 250px;height:20px /* dummy size, use you own */
}
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
.form-textbox, .form-textarea {
width: 250px;height:20px /* dummy size, use you own */
}
}
媒体 Q 上的好读物: Smashing Magazine
关于jquery - 如何删除弹出窗体中的滚动条，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25175037/