如何用CSS+DIV把网页中的内容分成相等两列
发布网友
发布时间:2022-04-19 21:49
我来回答
共2个回答
热心网友
时间:2022-04-19 23:18
自动到右边去?
从理论上来说没有这样布局的。
因为DIV来布局的缺点就是 兼容性差 没有table 稳定,所以我们布局一般来说要把DIV的布局 结构更细更固定 防止 兼容性问题的出现。
<!--左边-->
<div id="sidebar" class="FloatLeft">
<!--左边新闻-->
<div id="sidebar_news">
<div id="sidebar_news_top">
<h1>新闻中心 News</h1>
</div>
<div id="sidebar_news_content">
<ul class="newslist">
<li><a href="#">脱离*市场实际 HTC换帅难解困局</a></li>
<li><a href="#">脱离*市场实际 HTC换帅难解困局</a></li>
<li><a href="#">脱离*市场实际 HTC换帅难解困局</a></li>
<li><a href="#">脱离*市场实际 HTC换帅难解困局</a></li>
<li><a href="#">脱离*市场实际 HTC换帅难解困局</a></li>
</ul>
</div>
</div>
<!--左边新闻-->
<!--快速通道-->
<div id="FastTrack"></div>
<!--快速通道-->
<!--相关链接-->
<div id="aboutlink"></div>
<!--相关链接-->
</div>
<!--右边-->
<div id="content_right" class="FloatLeft">
<!--焦点图-->
<div id="focus">
<img src="images/focusimg.jpg" />
</div>
<!--焦点图-->
<!--学院简介-->
<div id="Introction" class="BasicCon">
<div id="Introction_title">
<h1>某某学院<span><a href="#">MORE</a></span></h1>
</div>
<div id="Introction_content">
<div id="Introction_img" class="FloatLeft">
<img src="images/xyimg.jpg" />
</div>
<div id="Introction_font" class="FloatLeft">
<p>大学产生之初,学院原是大学为了接待或者帮助来自其他国家和地区的贫困学生而提供的住宿场所。最早产生于1180年的巴黎大学,称为18人学院。顾名思义,该学院是为当时18名来自法国以外的贫困学生免费提供食宿的场所。后来,由于来自国外的学生不断增加,巴黎大学的学院数也随之扩大。13世纪以后,随着大学间国际交流的频繁,不仅在巴黎大学,欧洲其他一些著名的大学也相继建立了学院,而且随着大学规模的扩大,同一所大学中...</p>
</div>
</div>
</div>
<!--学院简介-->
<!--新闻-->
<div id="news" class="BasicCon">
<div id="news_title">
<h1>学院新闻<span><a href="#">MORE</a></span></h1>
</div>
</div>
<!--新闻-->
</div>
<!--右边-->
看,我这样的布局 是不是特别麻烦,写了特别多,但是我结构很清晰,很稳定 绝对不会出现IE7以及以上的兼容问题。而且便于修改
热心网友
时间:2022-04-20 00:36
你说的这个css中只有css3当中存在这个属性。看如下。就是将div里面的内容分成2部分来显示
.className
{
-moz-column-count:2; /* Firefox */
-webkit-column-count:2; /* Safari and Chrome */
column-count:2;
}
但是,你懂得,IE9.0以下不支持。因此可以这么说现代浏览器基本都是支持的,希望帮助到你