CSS:

  

<style>
.frame-header {
position: fixed;
top: 0;
right: 0;
left: 0;
z-index: 11;
min-width: 960px;
height: 38px;
border-top: 1px solid #333;
border-bottom: 1px solid #333;
background: #3B3B3B;
_position: absolute;
_width: 100%;
}
.frame-side {
position: absolute;
top: 40px;
right: 0;
bottom: 0;
z-index: 2;
width: 200px;
border-left: 1px solid #DBDBDB;
background: #F9F9F9;
box-shadow: inset 2px 0 3px rgba(0, 0, 0, 0.05);
_height: 100%;
}
.frame-contents {
position: absolute;
top: 40px;
right: 201px;
bottom: 0;
left: 0;
min-width: 760px;
}
.frame-contents iframe {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>

  

  HTML:

<div class="frame-header">I'm the header.</div>
<div class="frame-side">I'm the right-side.</div>
<div class="frame-contents">
<iframe src="http://www.baidu.com" frameborder="0" ></iframe>
</div>

  主体 frame-contents内容自适应高宽,超出部分滚动显示。

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-06-24
  • 2021-11-12
  • 2021-12-19
  • 2022-01-05
  • 2022-12-23
猜你喜欢
  • 2021-11-07
  • 2021-12-06
  • 2021-12-11
  • 2021-11-23
  • 2021-12-24
  • 2021-06-04
相关资源
相似解决方案