<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 class="img"></div></li>
<li><div class="img"></div></li>
<li><div class="img"></div></li>
</ul>
</div>

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

margin能够非常好的解决问题。

直接上代码,不解释。

margin隐藏最后的切割线的更多相关文章

  1. margin和padding那点事及常见浏览器margin padding相关Bug

    用Margin还是用Padding 何时应当使用margin: 需要在border外侧添加空白时. 空白处不需要背景(色)时. 上下相连的两个盒子之间的空白,需要相互抵消时.如15px + 20px的 ...

  2. 不要告诉我你懂margin

    分类: Html/CSS | 转载请注明: 出自 海玉的博客 本文地址: http://www.hicss.net/do-not-tell-me-you-understand-margin/ 你真的了 ...

  3. Margin是什么?

    Margin是什么 CSS 边距属性定义元素周围的空间.通过使用单独的属性,可以对上.右.下.左的外边距进行设置.也可以使用简写的外边距属性同时改变所有的外边距.——W3School 边界,元素周围生 ...

  4. 关于前端的margin

    margin 边界,元素周围生成额外的空白区.“空白区”通常是指其他元素不能出现且父元素背景可见的区域.——CSS权威指南 我比较喜欢使用“外边距”这个词来解释margin(同理padding可以称之 ...

  5. margin相关基本知识

    什么是 margin ? CSS 边距属性定义元素周围的空间.通过使用单独的属性,可以对上.右.下.左的外边距进行设置.也可以使用简写的外边距属性同时改变所有的外边距.——W3School 边界,元素 ...

  6. CSS技巧教程:margin在IE中的表现

    margin的位移方向是指margin数值为正值时候的情形,如果是负值则位移方向相反. 如上图所示:黄色子元素盒的margin-top,margin-left为负值时,如-10px,则黄色子元素盒向上 ...

  7. BFC以及margin的深入探究

    BFC(Block Formatting Context) 块级格式化上下文,它是指一个独立的块级渲染区域,只有block-level Box参与,该区域拥有一套渲染规则来约束块级盒子的布局,且与区域 ...

  8. CSS的margin属性:详解margin属性

    在网上看到的一篇文章,说的比较全面.原文地址:http://www.poluoluo.com/jzxy/201206/167007.html 你真的了解margin吗? 你知道margin有什么特性吗 ...

  9. 你是否彻底了解margin属性?

    写css,你少不了与margin打交道.你真的了解margin吗?你知道margin有什么特性吗?你知道什么是垂直外边距合并?margin在块元素.内联元素中的区别?什么时候该用padding而不是m ...

随机推荐

  1. android中图片倒影、圆角效果重绘

    本文用来记录一些Android 操作图片的方法,方便查看. 1.将Drawable转化为Bitmap public static Bitmap drawableToBitmap(Drawable dr ...

  2. chocolatey 的安装与安装过程中的注意事项

    安装的windows需求 Windows 7+ / Windows Server 2003+ PowerShell v2+ .NET Framework 4+   注意:chocolatey的网站可能 ...

  3. BZOJ 1007 HNOI 2008 水平可见直线 计算几何+栈

    题目大意:给出一些笛卡尔系中的一些直线,问从(0,+∞)向下看时能看到哪些直线. 思路:半平面交可做,可是显然用不上. 类似于求凸包的思想,维护一个栈. 先将全部直线依照k值排序.然后挨个压进去,遇到 ...

  4. 使用knockout.js 完毕template binding

    //1.template <script id="txn-details-template" type="text/html"> <!--St ...

  5. cv2.putText 文字换行('\n')无法解析换行

    OpenCV putText() new line character cv2.putText 在向图像中添加文本信息时,如果在待添加的文本中含有换行转义符,一般它是无法正确处理的: cv2.putT ...

  6. web service 原理

    Web Service基本概念 Web Service也叫XML Web Service WebService是一种可以接收从Internet或者Intranet上的其它系统中传递过来的请求,轻量级的 ...

  7. winform程序,备份数据库+并压缩+并删除以前的备份

    说明:为了定时备份服务器上的数据库并压缩到指定目录,方便下载到本地而写本程序.配合windows的任务计划,可以达到定时备份数据库的目的. 程序需引用SQLDMO.DLL,如电脑上已安装sqlserv ...

  8. android studio执行 Information:Gradle tasks [:app:assembleDebug]失败处理

    Error:Execution failed for task ‘:app:mergeDebugResources’. > Some file crunching failed, see log ...

  9. python3中让程序暂停运行的语句

    https://blog.csdn.net/zmz971751504/article/details/78288988

  10. .vsdc和.svf用于formal verification tools

    svf:Setup Verification for Formality