手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >margin隐藏最后的分割线无需循环输出判断是否到结尾
margin隐藏最后的分割线无需循环输出判断是否到结尾
摘要:*{margin:0;padding:0;}#demoli{border-bottom:1pxsolid#ccc;}#demoul{marg...

<style>

*{margin: 0;padding: 0;}

#demo li{

border-bottom: 1px solid #ccc;

}

#demo ul{

margin-bottom: -1px;

}

#demo{

overflow: hidden;

}

</style>

<div id="demo">

<ul>

<li>写个内容其实好困难啊。。。</li>

<li>写个内容其实好困难啊。。。</li>

<li>写个内容其实好困难啊。。。</li>

<li>写个内容其实好困难啊。。。</li>

<li>写个内容其实好困难啊。。。</li>

</ul>

</div>

<style>

#demo2{

background: #aaa;

width:620px;

}

#demo2 ul{

margin-right: -100px;

overflow: hidden;

}

#demo2 li{

float: left;

margin-right: 10px;

}

.img{

width: 200px;

height: 200px;

background: #ddd;

}

</style>

<div id="demo2">

<ul>

<li><div></div></li>

<li><div></div></li>

<li><div></div></li>

</ul>

</div>

一般来说,我们都不喜欢看到最后有一条线,但是用样式去清楚那最后的线,非常麻烦,循环输出时,还要判断是否到结尾。

margin可以很好的解决这个问题。

直接上代码,不解释。

【margin隐藏最后的分割线无需循环输出判断是否到结尾】相关文章:

CSS样式表中的类

DIV+CSS:网页一行两列背景自适应

margin和padding

margin 负值引起的层级(z-index)问题

Iframe 用法浅析

CSS屏蔽Webkit浏览器input高亮和textarea缩放

用CSS来控制网页背景

如何实现条状图表形式

图片的翻转按钮怎么制作

DIV+CSS常用网页制作布局技术技巧

精品推荐
分类导航