margin隐藏最后的切割线
<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隐藏最后的切割线的更多相关文章
- margin和padding那点事及常见浏览器margin padding相关Bug
用Margin还是用Padding 何时应当使用margin: 需要在border外侧添加空白时. 空白处不需要背景(色)时. 上下相连的两个盒子之间的空白,需要相互抵消时.如15px + 20px的 ...
- 不要告诉我你懂margin
分类: Html/CSS | 转载请注明: 出自 海玉的博客 本文地址: http://www.hicss.net/do-not-tell-me-you-understand-margin/ 你真的了 ...
- Margin是什么?
Margin是什么 CSS 边距属性定义元素周围的空间.通过使用单独的属性,可以对上.右.下.左的外边距进行设置.也可以使用简写的外边距属性同时改变所有的外边距.——W3School 边界,元素周围生 ...
- 关于前端的margin
margin 边界,元素周围生成额外的空白区.“空白区”通常是指其他元素不能出现且父元素背景可见的区域.——CSS权威指南 我比较喜欢使用“外边距”这个词来解释margin(同理padding可以称之 ...
- margin相关基本知识
什么是 margin ? CSS 边距属性定义元素周围的空间.通过使用单独的属性,可以对上.右.下.左的外边距进行设置.也可以使用简写的外边距属性同时改变所有的外边距.——W3School 边界,元素 ...
- CSS技巧教程:margin在IE中的表现
margin的位移方向是指margin数值为正值时候的情形,如果是负值则位移方向相反. 如上图所示:黄色子元素盒的margin-top,margin-left为负值时,如-10px,则黄色子元素盒向上 ...
- BFC以及margin的深入探究
BFC(Block Formatting Context) 块级格式化上下文,它是指一个独立的块级渲染区域,只有block-level Box参与,该区域拥有一套渲染规则来约束块级盒子的布局,且与区域 ...
- CSS的margin属性:详解margin属性
在网上看到的一篇文章,说的比较全面.原文地址:http://www.poluoluo.com/jzxy/201206/167007.html 你真的了解margin吗? 你知道margin有什么特性吗 ...
- 你是否彻底了解margin属性?
写css,你少不了与margin打交道.你真的了解margin吗?你知道margin有什么特性吗?你知道什么是垂直外边距合并?margin在块元素.内联元素中的区别?什么时候该用padding而不是m ...
随机推荐
- excel表如何实现多if选择结构多分支判断
excel表如何实现多if选择结构多分支判断 一.总结 一句话总结:把多if分支转换成单if分支相加. 也可以if分支,也可以lookup函数. 1.CHOICE: +2 if band A; +1 ...
- 7.Node.js 创建第一个应用
转自:http://www.runoob.com/nodejs/nodejs-tutorial.html 如果我们使用PHP来编写后端的代码时,需要Apache 或者 Nginx 的HTTP 服务器, ...
- 使用缓存Memcache存储更新微信access token
关键字:Memcache access_token 更新 存储 7200 本文介绍如何使用缓存Memcache存储及更新 access token的方法. 一.Access Token access_ ...
- JS match方法的返回数据的探究
match方法是JS的字符串方法,详细说明可以看MDN的说明. 如果正则表达式匹配成功的话,match方法会返回一个数组,而数组里的数据有两种形式,对应着匹配方式:全局匹配与非全局匹配. 1. 全局匹 ...
- vue项目使用axios
使用: npm install axios --save-dev 在main.js中import: 使用: (1):POST方式 let data= [{receiveAdd:receiveAddVa ...
- Docker+Solr
原文:Docker+Solr docker 内的solr并不是部署在tomcat里,而是自启动的.默认的home是/opt/solr/server/solr # docker search solr ...
- SQLite-SQLiteDatabase 数据库实例练习
今天趁着有时间,自己在网上找了相关的数据库操作代码,进行了一下练习,先上代码 main.xml文件 <RelativeLayout xmlns:android="http://sche ...
- 2.Web开发过程流程图
转自:https://blog.csdn.net/hello_simon/article/details/19993343 最近公司在进行一系列新模块的开发,在痛苦开发的过程中,大家不时在一起进行总结 ...
- PHP服务器环境打开配置文件
MAC 1. cd /usr/local/etc/nginx/servers vim www.xxx.com 2. 在/usr/local/etc/nginx/servers目录下,不同的 .con ...
- MES制造系统
给大家介绍一个非常不错的MES专业产品网站,http://www.OrBitMES.com 上面分为初.中.高各级的难得的MES产品学习资料下载, http://www.orbitmes.com/Pr ...