Css 如何将元素相对于正文固定在页面外流?
我不是一个真正的前端开发人员,但是Css 如何将元素相对于正文固定在页面外流?,css,Css,我不是一个真正的前端开发人员,但是 我需要创建一个元素(下面用红色表示) 这仍然是相对于页面的(如行所示,因此当我更改窗口比例时,它基本上保持在页面上的相同位置) 但是超出了页面其余部分的流程(因此字段集,从“现金管理”开始,位于“投资杂志”标题下) 请问我该怎么做? 可能有几种方法可以做到这一点,但这里有一些方法供您参考 选项1使用浮动: 将主要内容和红色侧块视为两列。把它们都浮起来,给它们一个宽度,然后把它们放在一个容器里 HTML 参见小提琴: 选项2使用定位: 绝对要把红块放在你想要
- 我需要创建一个元素(下面用红色表示)
- 这仍然是相对于页面的(如行所示,因此当我更改窗口比例时,它基本上保持在页面上的相同位置)
- 但是超出了页面其余部分的流程(因此字段集,从“现金管理”开始,位于“投资杂志”标题下)
可能有几种方法可以做到这一点,但这里有一些方法供您参考 选项1使用浮动: 将主要内容和红色侧块视为两列。把它们都浮起来,给它们一个宽度,然后把它们放在一个容器里 HTML 参见小提琴: 选项2使用定位: 绝对要把红块放在你想要的地方 HTML 参见小提琴:
<div class="row">
<section>
<h1>Investing Magazine</h1>
<p>Your content here</p>
</section>
<aside>
<p>The side block here</p>
</aside>
</div>
.row:before, .row:after {
content: " ";
display: table;
line-height: 0; }
.row:after { clear: both; }
.row { *zoom: 1; }
section {
float: left;
width: 80%; }
aside {
float: left;
width:20%;
background: red; }
<section>
<h1>Investing Magazine</h1>
<p>Your content here</p>
</section>
<aside>
<p>The side block here</p>
</aside>
section { width: 80%; }
aside {
position: absolute;
width:20%;
top:0; right:0;
background: red; }