去掉inline-block元素间隙的几种方法
<!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元素间隙的几种方法的更多相关文章
- CSS 去掉inline-block元素间隙的几种方法
最近做移动端页面时,经常会用到inline-block元素来布局,但无可避免都会遇到一个问题,就是inline-block元素之间的间隙.这些间隙会导致一些布局上的问题,需要把间隙去掉.对于inlin ...
- after及before伪元素及解决父元素塌陷的几种方法
一.伪类和伪元素 CSS中伪类和伪元素有很多,也很好用!如果熟练使用的话可以解决很多问题 首先明白什么是伪类:伪类是基于当前元素的状态,而不是元素的id class等静态标志,它是动态变化的,它会在一 ...
- jquery阻止元素冒泡的两种方法
通常情况下,如果给父元素添加事件之后,子元素也会继承同样的事件,这个时候就要阻止子元素的这种行为,成为阻止冒泡,总结两种解决方法: html代码: <div id="parent&qu ...
- Knockout获取数组元素索引的2种方法,在MVC中实现
原文:Knockout获取数组元素索引的2种方法,在MVC中实现 在遍历数组.集合的时候,通常要获取元素的索引,本篇体验使用Knockout获取索引的2种方法. 假设有这样的一个模型: namespa ...
- 【亲测显式等待】Selenium:元素等待的4种方法
Selenium:元素等待的4种方法 1.使用Thread.sleep(),这是最笨的方法,但有时候也能用到而且很实用. 2.隐式等待,隐性等待是指当要查找元素,而这个元素没有马上出现时,告诉We ...
- js中如何删除某个元素下面的所有子元素?(两种方法)
js中如何删除某个元素下面的所有子元素?(两种方法) 一.总结 方法一:通过元素的innerHTML属性 元素element.innerHTML=""; 方法二:通过元素的remo ...
- CSS 去掉inline-block间隙的几种方法
最近做移动端页面时,经常会用到inline-block元素来布局,但无可避免都会遇到一个问题,就是inline-block元素之间的间隙.这些间隙会导致一些布局上的问题,需要把间隙去掉.对于inlin ...
- [CSS]去除inline-block元素间距的几种方法
当我们使用inline-block 时,会出现空白间距问题. 但这些间距对我们的布局,或兼容性产生影响,我们需要去除它,该怎么办?下面简单介绍几种方法: 1.去掉html元素之间的空格,直接写在一行. ...
- [Leetcode]315.计算右侧小于当前元素的个数 (6种方法)
链接 给定一个整数数组 nums,按要求返回一个新数组 counts.数组 counts 有该性质: counts[i] 的值是 nums[i] 右侧小于 nums[i] 的元素的数量. 示例: 输 ...
随机推荐
- 如何在Objective-C中实现链式语法
在接触到开源项目 Masonry 后,里面的布局约束的链式写法让我颇感兴趣,就像下面这样: 1 2 3 4 5 6 7 8 UIEdgeInsets padding = UIEdgeInsetsMak ...
- offsetLeft,Left,clientLeft的区别
offsetLeft,Left,clientLeft的区别 假设 obj 为某个 HTML 控件. obj.offsetTop 指 obj 相对于版面或由 offsetParent 属性指定的父坐标的 ...
- struts2视频学习笔记 29-30(Struts 2常用标签,防止表单重复提交)
课时28 Struts 2常用标签解说 property标签 property标签用于输出指定值: <s:set name="name" value="'kk'&q ...
- toggleClass() 方法做类似于微信扣扣点击语音图标按钮变成切换到语音输入功能,点击键盘图标按钮切换到文字输入状态的效果
就是这种效果的类似. <html><head><script type="text/javascript" src="/jquery/jqu ...
- BZOJ3996 [TJOI2015]线性代数
就是求$D = A \times B \times A^T - C \times A^T$ 展开也就是$$D = \sum_{i, j} A_i * A_j * B_{i, j} - \sum_{i} ...
- 9个充满想象力的 JavaScript 物理和重力实验
在这个列表中挑选了9个物理和重力实验,用来展示 Javascript 的强大.几年前,所有这些实验都必须使用 Java 或 Flash 才能做.在下面这些惊人的例子中,就个人而言,我比较喜欢仿真布料的 ...
- Future 模式介绍
假设一个任务执行需要花费一些时间,为了省去不必要的等待时间,可以先获取一个提货单,即future,然后继续处理别的任务,知道货物到达,即任务完成得到结果,此时可以使用提货单提货,即通过future得到 ...
- Unity中的Path对应各平台中的Path
OS: Application.dataPath : Application/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx/xxx.a ...
- soap
sudo apt-get update apt-get install php-soapphp-config --configure-options --enable-soap php -i | gr ...
- C++-const_cast只能用于指针和引用,对象的const到非const可以用static_cast
Static_cast可以对对象也可以对指针也可以对引用,但是const_cast只可以对指针和引用使用,后者不可以对对象用,如果你要把一个const值转化为非const值只能用隐式执行或通过使用st ...