Я делаю некоторые образовательные тесты. ссылочный сайт таков: https://www.whoismyisp.org/
я собираюсь сделать 2 div с 1 iframe внутри каждого. Я хотел бы показать только те области, которые меня интересуют, на исходной странице. пример изображения
step1 https://reportage.altervista.org/wp-content/index.htm
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Mostra il mio ISP</title>
<meta name="apple-mobile-web-app-capable" content="yes">
<style>
div{
width:900px;
height:150px;
position:relative;
border: 0px solid black;
overflow:hidden;
margin-right: auto;
margin-left: auto;
}
iframe{
position:absolute;
width:1000px;
height:400px;
top:-170px;
left:-50px;
}
</style>
</head>
<body>
<div>
<iframe name="myIframe" src="https://www.whoismyisp.org/" scrolling="no" frameborder="no"> </iframe>
</div>
</body>
</html>
.
step2 https://reportage.altervista.org/wp-content/test_OK.htm
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Mostra il mio ISP</title>
<meta name="apple-mobile-web-app-capable" content="yes">
<style>
div{
width:340px;
height:150px;
position:relative;
border: 0px solid black;
overflow: hidden;
margin-right: auto;
margin-left: auto;
}
iframe{
position:absolute;
width:1000px;
height: 1400px;
top:-925px;
left:-10px;
}
</style>
</head>
<body>
<div>
<iframe name="myIframe" src="https://www.whoismyisp.org/" scrolling="no" frameborder="no"> </iframe>
</div>
</body>
</html>
мой болезненный результат объединения вещей: проблема результата это как если бы характеристики второго iframe были проигнорированы
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Mostra il mio ISP</title>
<meta name="apple-mobile-web-app-capable" content="yes">
<style>
div.a {
width:340px;
height:150px;
position:relative;
border: 0px solid black;
overflow:hidden;
margin-right: auto;
margin-left: auto;
}
iframe{
position:absolute;
width:1000px;
height: 1400px;
top:-925px;
left:-10px;
}
div.b {
width:900px;
height:150px;
position:relative;
border: 0px solid black;
overflow:hidden;
margin-right: auto;
margin-left: auto;
}
iframe{
position:absolute;
width:1000px;
height:400px;
top:-170px;
left:-50px;
}
</style>
</head>
<body>
<div class="a">
<iframe name="myIframe1" src="https://www.whoismyisp.org/" scrolling="no" frameborder="no"> </iframe>
</div>
<div class="b">
<iframe name="myIframe2" src="https://www.whoismyisp.org/" scrolling="no" frameborder="no"> </iframe>
</div>
</body>
</html>