编程 Javascript

如何消除inline-block属性带来的标签间间隙

Posted in Javascript onMarch 31, 2016

1、给inline-block元素设置一个父元素。

设置父元素的font-size：0；。子元素font-size设置成合适大小，如果不设置子元素font-size，子元素会继承父元素的0；

2、给inline-block元素设置一个父元素。(letter-spacing：字符间距)

　设置父元素的letter-spacing为-4px或-8px，除谷歌是-8px外，其余是-4px。同样要设置子元素的letter-spacing：0；否则会

继承父元素，造成子元素内文字变形。

经过试验，统一设置成-8px，在视觉上没有什么差异，不知道这样做可行不可行，如果哪位有意见，随时可以说。

3、给inline-block元素设置一个父元素。(word-spacing：单词间距)

设置父元素的word-spacing为-4px或-8px，谷歌，360是-8px，火狐，IE是-4px。同样要设置子元素的word-spacing：0；否则会继承父元素，造成子元素内文字变形。

同上也可以统一设置为-8px

4、以上谷歌、火狐、360的测试均是在最新浏览器上测试，IE8测试。如有不妥还请告知。

以上内容是小编给大家介绍的inline-block属性带来的标签间间隙问题，希望对大家有所帮助！

如何消除inline-block属性带来的标签间间隙

- Author -

走向未知

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

可拖动窗口，附带鼠标控制渐变透明，开启关闭功能

Jun 26 Javascript

用js自动判断浏览器分辨率的代码

Jan 28 Javascript

js 操作符实例代码

Oct 24 Javascript

同时使用n个window onload加载实例介绍

Apr 25 Javascript

jquery easyui 结合jsp简单展现table数据示例

Apr 18 Javascript

JavaScript检测字符串中是否含有html标签实现方法

Jul 01 Javascript

深入浅析knockout源码分析之订阅

Jul 12 Javascript

浅谈js数据类型判断与数组判断

Aug 29 Javascript

单行 JS 实现移动端金钱格式的输入规则

May 22 Javascript

JS使用ActiveXObject实现用户提交表单时屏蔽敏感词功能

Jun 20 Javascript

VS Code转换大小写、修改选中文字或代码颜色的方法

Dec 15 Javascript

js实现点击生成随机div

Jan 16 Javascript

JavaScript笔记之数据属性和存储器属性

Mar 31 #Javascript

Node.js中Request模块处理HTTP协议请求的基本使用教程

Mar 31 #Javascript

基于JQuery打造无缝滚动新闻步骤详解

Mar 31 #Javascript

JavaScript位移运算符(无符号) >>> 三个大于号的使用方法详解

Mar 31 #Javascript

JQuery实现简单的服务器轮询效果实例

Mar 31 #Javascript

JavaScript实现复制内容到粘贴板代码

Mar 31 #Javascript

JavaScript是如何实现继承的(六种方式)

Mar 31 #Javascript

You might like

Zerg剧情介绍

2020/03/14 星际争霸

站长助手-网站web在线管理程序 v1.0 下载

2007/05/12 PHP

用PHP实现的随机广告显示代码

2007/06/14 PHP

查找mysql字段中固定字符串并替换的几个方法

2012/09/23 PHP

在PHP上显示JFreechart画的统计图方法

2013/11/03 PHP

yii框架表单模型使用及以数组形式提交表单数据示例

2014/04/30 PHP

PHP网页游戏学习之Xnova(ogame)源码解读（十六）

2014/06/30 PHP

Jquery CheckBox全选方法代码附js checkbox全选反选代码

2010/06/09 Javascript

jQuery中获取checkbox选中项等操作及注意事项

2013/11/24 Javascript

JavaScript cookie的设置获取删除详解

2014/02/11 Javascript

JS实现简单的二维矩阵乘积运算

2016/01/26 Javascript

Bootstrap表单组件教程详解

2016/04/26 Javascript

jQuery实现的简单拖拽功能示例

2016/09/13 Javascript

基于vue的短信验证码倒计时demo

2017/09/13 Javascript

利用Node.js了解与测量HTTP所花费的时间详解

2017/09/22 Javascript

React Native中导航组件react-navigation跨tab路由处理详解

2017/10/31 Javascript

基于JavaScript中标识符的命名规则介绍

2018/01/06 Javascript

Vue项目中最新用到的一些实用小技巧

2018/11/06 Javascript

JS实现iframe中子父页面跨域通讯的方法分析

2020/03/10 Javascript

vue-resource 拦截器interceptors使用详解

2021/01/18 Vue.js

Python中的startswith和endswith函数使用实例

2014/08/25 Python

深入理解Python中字典的键的使用

2015/08/19 Python

python实现井字棋游戏

2020/03/30 Python

python 连接sqlite及简单操作

2017/06/30 Python

python中利用zfill方法自动给数字前面补0

2018/04/10 Python

Python实现的求解最小公倍数算法示例

2018/05/03 Python

Python元组常见操作示例

2019/02/19 Python

Python解析多帧dicom数据详解

2020/01/13 Python

python多项式拟合之np.polyfit 和 np.polyld详解

2020/02/18 Python

python数据库开发之MongoDB安装及Python3操作MongoDB数据库详细方法与实例

2020/03/18 Python

python如何调用java类

2020/07/05 Python

美国体育用品商店：Paragon Sports

2017/10/08 全球购物

自我鉴定标准格式

2014/03/19 职场文书

校长创先争优承诺书

2014/08/30 职场文书

学校群众路线专项整治方案

2014/10/31 职场文书

班级元旦晚会开幕词

2015/01/29 职场文书