Home >Web Front-end >HTML Tutorial >Three commonly used automatic adaptation width columns in div css_html/css_WEB-ITnose
Three commonly used automatic adaptation width columns in div css_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:28:431292browse
CSS两列布局，右侧固定，左侧自适应宽度 <div style="width:90%; margin:0 auto; overflow:auto; _display:inline-block;"> <div style="width:200px; float:right; background:#090">这是右侧的内容</div> <div style=" margin-right:210px; background:#F33">这是左侧的内容，自适应宽度</div> </div> CSS两列布局，左侧固定，右侧自适应宽度 <div style="width:90%; margin:0 auto; overflow:auto; _display:inline-block;"> <div style="width:150px; float:left; background:#6F0">这是左侧的内容 固定宽度</div> <div style=" margin-left:160px; background:#FC0">中间内容，自适应宽度</div> </div> CSS三列布局，左右宽度固定，中间自适应宽度 <div style="width:90%; margin:0 auto; overflow:auto; _display:inline-block;"> <div style="width:200px; float:right; background:#393"> 这是右侧的内容 固定宽度</div> <div style="width:150px; float:left; background:#F60 ">这是左侧的内容 固定宽度</div> <div style=" margin-left:160px;margin-right:210px; background:#6C3;">中间内容，自适应宽度</div> </div>
overflow:auto; _display:inline-block; clears floats, _display:inline-block; is for IE6.
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn