css 横排实现代码

2024-07-11 08:27:39

字体：大中小

来源：转载

供稿：网友

效果预览:

css:

复制代码

代码如下:
<style type="text/css">

</style>

html:

复制代码

代码如下:
<div class="table_tr">
<div class="table_tile">top0</div>
<div class="table_tile_">top1</div>
<div class="table_tile">top2</div>
<div class="table_tile">top3</div>
</div>
<div class="table_tr">
<div class="table_tile_bottom">bottom0</div>
<div class="table_tile_bottom">bottom1</div>
<div class="table_tile_bottom">bottom2</div>
<div class="table_tile_bottom">bottom3</div>
</div>

或者来个更简单的:

复制代码

代码如下:
<style>
.float_left{
text-align:left;
height: 20px;
width: 25%;
float: left;
}
</style>
<div class = "float_left">asdasd</div>
<div class = "float_left">asdasd</div>
<div class = "float_left">why</div>

上一篇：CSS 扑克牌效果实现代码

下一篇：IE与Firefox中兼容的html设计中使用CSS改变鼠标为手形