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 ...
随机推荐
- java初始化过程中成员变量
package day01; class Base{ int j; //1.j=0 Base(){ add(1); //2.调用子类add()方法 System.out.println(j); //4 ...
- C#解析HTML源码
刚做了一个小任务,需要抓取其他网站的部分数据,这里就顺便介绍使用Winista.Text.HtmlParser这个类库如何解析HTML并抓取部分数据 1.获取指定网站的页面源码 string url ...
- Trie&可持久化Trie
WARNING:以下代码未经测试,若发现错误,欢迎指出qwq~ Trie树(字典树) 一种简单的数据结构,可存储大量字符串,可在$O(len)$的时间内完成插入,删除,查找等操作. 下面是一个简单的例 ...
- 【习题 7-7 UVA-12558】Egyptian Fractions (HARD version)
[链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 迭代加深搜索. 枚举最大量maxdep 在dfs里面传剩余的要凑的分子.分母 以及上一次枚举的值是多少. 然后找到最小的k,满足1/ ...
- View源码分析如何创建
本文来自http://blog.csdn.net/liuxian13183/ ,引用必须注明出处! 文/jj120522 博主导读:View是Android中最重要的控件,几乎所有的控件都与View相 ...
- 【AtCoder Regular Contest 082 F】Sandglass
[链接]点击打开链接 [题意] 你有一个沙漏. 沙漏里面总共有X单位的沙子. 沙漏分A,B上下两个部分. 沙漏从上半部分漏沙子到下半部分. 每个时间单位漏1单位的沙子. 一开始A部分在上面.然后在r1 ...
- MyCat中间件:读写分离(转)
利用MyCat中间件实现读写分离 需要两步: 1.搭建MySQL主从复制环境 2.配置MyCat读写分离策略 一.搭建MySQL主从环境 参考上一篇博文:MySQL系列之七:主从复制 二.配置MyCa ...
- STL_算法_删除(unique、unique_copy)
C++ Primer 学习中. . . 简单记录下我的学习过程 (代码为主) 全部容器适用 unique(b,e) unique(b,e,p) unique_copy(b1,e1,b2) unique ...
- Windows Forms 布局篇
1,锚定功能(Anchor属性) 默认为“Top,Left”,不管窗体大小如果改变,保持相对于窗体左上角的位置. 如果设置为”Top,Bottom,Left,Right”这样,控件的大小将随窗体的大小 ...
- 编程一一C语言的问题,cpu中的专用寄存器