<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>左边固定右边自适应</title>
<style type="text/css">
.out{
width: 90%;
margin: 0 auto;
height: 300px;
/*background: yellow;*/
position: relative;
}
.left{
width: 200px;
background: rgba(255,0,0,0.5);
height: 200px;
/*float: left;*/
position: absolute;
left: 0;
top: 0;
}
.right{
height: 500px;
background: blue;
margin-left: 200px;
/*float: right;*/
}
</style>
</head>
<body>
<div class="out">
<div class="left"></div>
<div class="right">你可能遭遇了毒手的攻击和背叛,这导致了我们无法开展调查,
内容随便写的只是为了看看效果是怎么样子的。布局分布分多种。常见的需要了解 才能开展工作。</div>
</div>
</body>
</html>
布局二:左边固定右边自适应
原创lanseshuai ©著作权
©著作权归作者所有:来自51CTO博客作者lanseshuai的原创作品,请联系作者获取转载授权,否则将追究法律责任
上一篇:git的项目完整操作
下一篇:vue项目实战:函数式组件、组件传值、组件守卫、路由传参的方式区别、生命周期、常用语法汇总等 localStorage、sessionStorage作用域以及使用异同
提问和评论都可以,用心的回复会被更多人看到
评论
发布评论
相关文章
-
左固定右边自适应html css
-
css布局之左侧固定右侧自适应布局
参考代码如下:
html ico ios lua 3d -
CSS两列高度自适应,右边自适应
CSS两列高度自适应,右边自适应
html 高度自适应 自适应 css 编程 -
左右固定宽度中间自适应布局方式
话不多说先上要实现的效果:(很简单水平居中
html 自适应 css -
左边定宽右边自适应布局
AAAAAAA BBBBBBBBB
html css 其他