与HTML并排显示两个文档

我是HTML新手，希望做一些相当简单的事情。我已经搜索了类似的问题并尝试了解决方案，但都没有工作。与HTML并排显示两个文档

我想要在单击链接时并排显示网页中的两个文档。文档远程存储，不是静态的。一个是PDF，另一个是图像，所以我觉得PDF可能需要嵌入，所以有一个滚动条？

两个文档都在显示，但第二个文档（图像）部分覆盖了屏幕中央的第一个文档。

我的代码如下：

<a href= "#" onclick= "lightbox_open();"><b>Click me to view files</b></a> 

<div id= "light"><a href= "#" onclick= "lightbox_close();"><embed src= "?php 
echo $address ?>" style= "float: left;"/><img src = "<?php echo $address2 
?>" style= "float: left; " /></a></div> 

<div id= "fade" onclick="lightbox_close();"></div> 

<div>

**注意lightbox_open（）和lighbox_close（）的函数是有显示的画面时，文档时调暗屏幕。

任何帮助，这将不胜感激。

来源

2017-01-05 Juani Tab

你可以使用[Bootstrap]（http://getbootstrap.com/）吗？ –

虽然这不是一个PHP问题'？php echo $ address？>'是一个错误。你也可能想看看模式，我认为它会更容易使用，然后造型。 – chris85

我使用php代码提取文件的远程地址，因此需要<？php echo $ address？>。 –

结帐这里的例子http://n-demo.000webhostapp.com/two_docs.html

我在这里使用的iframe，您可以使用嵌入太相似。

下面是示例使用嵌入

http://n-demo.000webhostapp.com/embed_two_docs.html

源代码是完全相同的刚更换的iframe与嵌入的链接。

<style> html, 
 
body { 
 
    width: 100%; 
 
    height: 100%; 
 
} 
 
#doc1, 
 
#doc2 { 
 
    display: inline-block; 
 
    width: 49%; 
 
    height: 100% 
 
} 
 
iframe { 
 
    width: 100%; 
 
    height: 100%; 
 
    border: none; 
 
} 
 
#doc1 { 
 
    background-color: red; 
 
} 
 
#doc2 { 
 
    background-color: blue; 
 
}

<html> 
 

 
<head> 
 
</head> 
 

 
<body translate="no"> 
 

 
    <div id="doc1"> 
 
    <iframe src="http://www.pdf995.com/samples/pdf.pdf"></iframe> 
 
    </div> 
 

 
    <div id="doc2"> 
 
    <iframe src="http://www.pdf995.com/samples/pdf.pdf"></iframe> 
 
    </div> 
 
</body> 
 

 
</html>

您将无法在这里看到的iframe在计算器的片段是一个IFRAME里面已经和iframe不能在另一个iframe中加载。

来源

2017-01-05 14:20:33

与HTML并排显示两个文档

回答

相关问题