<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="Author" content="胡超">
<title>super胡</title>
<style>

#a1 {
list-style: none ;
background: green;
text-align: center;
padding:10px;
}
#a1 li {
display: inline-block;
background: orange;

}
#a2 {
list-style: none ;
background: green;
text-align: center;
padding:10px;
}
#a2 li {
display: inline-block;
background: orange;

}
#a3 {
list-style: none ;
background: green;
text-align: center;
padding:10px;
font-size:0px;/*父元素设置 font-size:0px; 子元素需要重新设置*/
}
#a3 li {
display: inline-block;
background: orange;
font-size:16px;
}
#a4 {
list-style: none ;
background: green;
text-align: center;
padding:10px;
}
#a4 li {
display: inline-block;
background: orange;

}

</style>
</head>
<body>
<ul id="a1">
<li>item1
</li><!--
--><li>item2 <!--注释法作为了解 -->
</li><li>item3
</li><li>item4
</li><li>item5
</li>
</ul>

<ul id="a2">
<li>item1
</li><li>item2<!--让</li><li>之间没有空隙-->
</li><li>item3
</li><li>item4
</li><li>item5
</li>
</ul>
<ul id="a3">
<li>item1 <!--父元素设置 font-size:0px; 子元素需要重新设置-->
</li>
<li>item2
</li>
<li>item3
</li>
<li>item4
</li>
<li>item5
</li>
</ul>
<ul id="a4">
<li>item1
<li>item2
<li>item3
<li>item4
<li>item5
</li><!--去掉结束标签-->
</ul>
</body>
</html>

去掉inline-block元素间隙的几种方法的更多相关文章

  1. CSS 去掉inline-block元素间隙的几种方法

    最近做移动端页面时,经常会用到inline-block元素来布局,但无可避免都会遇到一个问题,就是inline-block元素之间的间隙.这些间隙会导致一些布局上的问题,需要把间隙去掉.对于inlin ...

  2. after及before伪元素及解决父元素塌陷的几种方法

    一.伪类和伪元素 CSS中伪类和伪元素有很多,也很好用!如果熟练使用的话可以解决很多问题 首先明白什么是伪类:伪类是基于当前元素的状态,而不是元素的id class等静态标志,它是动态变化的,它会在一 ...

  3. jquery阻止元素冒泡的两种方法

    通常情况下,如果给父元素添加事件之后,子元素也会继承同样的事件,这个时候就要阻止子元素的这种行为,成为阻止冒泡,总结两种解决方法: html代码: <div id="parent&qu ...

  4. Knockout获取数组元素索引的2种方法,在MVC中实现

    原文:Knockout获取数组元素索引的2种方法,在MVC中实现 在遍历数组.集合的时候,通常要获取元素的索引,本篇体验使用Knockout获取索引的2种方法. 假设有这样的一个模型: namespa ...

  5. 【亲测显式等待】Selenium：元素等待的4种方法

    Selenium:元素等待的4种方法 1.使用Thread.sleep(),这是最笨的方法,但有时候也能用到而且很实用.   2.隐式等待,隐性等待是指当要查找元素,而这个元素没有马上出现时,告诉We ...

  6. js中如何删除某个元素下面的所有子元素？（两种方法）

    js中如何删除某个元素下面的所有子元素?(两种方法) 一.总结 方法一:通过元素的innerHTML属性 元素element.innerHTML=""; 方法二:通过元素的remo ...

  7. CSS 去掉inline-block间隙的几种方法

    最近做移动端页面时,经常会用到inline-block元素来布局,但无可避免都会遇到一个问题,就是inline-block元素之间的间隙.这些间隙会导致一些布局上的问题,需要把间隙去掉.对于inlin ...

  8. [CSS]去除inline-block元素间距的几种方法

    当我们使用inline-block 时,会出现空白间距问题. 但这些间距对我们的布局,或兼容性产生影响,我们需要去除它,该怎么办?下面简单介绍几种方法: 1.去掉html元素之间的空格,直接写在一行. ...

  9. [Leetcode]315.计算右侧小于当前元素的个数 (6种方法)

    链接 给定一个整数数组 nums,按要求返回一个新数组 counts.数组 counts 有该性质: counts[i] 的值是  nums[i] 右侧小于 nums[i] 的元素的数量. 示例: 输 ...

随机推荐

  1. 127. 126. Word Ladder *HARD* -- 单词每次变一个字母转换成另一个单词

    127. Given two words (beginWord and endWord), and a dictionary's word list, find the length of short ...

  2. MessageDigest简介

    一.概述 MessageDigest 类为应用程序提供信息摘要算法的功能,如 MD5 或 SHA 算法.信息摘要是安全的单向哈希函数,它接收任意大小的数据,并输出固定长度的哈希值. MessageDi ...

  3. 网页 console的使用

    通过按下回车键会触发执行命令,而有时候我们需要执行的逻辑比较复杂,需要多行才可以完成,可以通过点击“shift+回车键”来实现换行. 在console中,可以实现对按钮的监控.比如此时按钮的文本值为“ ...

  4. PHP多线程类

    <?php /** * @title: PHP多线程类(Thread) * @version: 1.0 * @author: phper.org.cn < web@phper.org.cn ...

  5. GCJ 2015-Qualification-A Standing Ovation 难度:0

    https://code.google.com/codejam/contest/6224486/dashboard#s=p0 肯定把朋友们都设置在第0位,在第i位前面必须至少有i个人鼓掌,所以答案加上 ...

  6. UVa 11762 - Race to 1

    http://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem&p ...

  7. 在Linux中查看文件的编码及对文件进行编码转换

    如果你需要在Linux中操作windows下的文件,那么你可能会经常遇到文件编码转换的问题.Windows中默认的文件格式是GBK(gb2312),而Linux一般都是UTF-8.下面介绍一下,在Li ...

  8. c# MVC在WEB.Config中配置MIME

    在IIS中,默认没有添加.json格式的MIME,所有无法读取服务器中的.json格式的文件,返回结果404 方式一:在IIS中手动添加MIME 1.点击MIME进入MIME列表 2.添加MIME 3 ...

  9. Android事件处理--读书笔记

    2013-12-28 17:57:17 1. Android提供了两种方式的事件处理:基于回调和基于监听的事件处理: 1.1 对基于监听的事件处理而言,主要做法是为Android界面组件绑定特定的事件 ...

  10. 神奇的NOIP模拟赛 T3 LGTB 玩THD

    LGTB 玩THD LGTB 最近在玩一个类似DOTA 的游戏名叫THD有一天他在守一座塔,对面的N 个小兵排成一列从近到远站在塔前面每个小兵有一定的血量hi,杀死后有一定的金钱gi每一秒,他都可以攻 ...