编程 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 相关文章推荐

动态控制Table的js代码

Mar 07 Javascript

Prototype的Class.create函数解析

Sep 22 Javascript

js超时调用setTimeout和间歇调用setInterval实例分析

Jan 28 Javascript

javascript中var的重要性分析

Feb 11 Javascript

JavaScript多图片上传案例

Sep 28 Javascript

Angular页面间切换及传值的4种方法

Nov 04 Javascript

基于node.js的fs核心模块读写文件操作(实例讲解)

Sep 10 Javascript

详解Vue取消eslint语法限制

Aug 04 Javascript

浅谈微信JS-SDK 微信分享接口开发（介绍版）

Aug 15 Javascript

使vue实现jQuery调用的两种方法

May 12 jQuery

用Golang运行JavaScript的实现示例

Nov 25 Javascript

webpack4从0搭建组件库的实现

Nov 29 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

php获得文件扩展名三法

2006/11/25 PHP

PHP实现基于栈的后缀表达式求值功能

2017/11/10 PHP

PHP registerXPathNamespace()函数讲解

2019/02/03 PHP

Laravel如何自定义command命令浅析

2019/03/23 PHP

Thinkphp框架使用list_to_tree 实现无限级分类列出所有节点示例

2020/04/04 PHP

ie 调试javascript的工具

2009/04/29 Javascript

Javascript 文件夹选择框的两种解决方案

2009/07/01 Javascript

jquery 输入框数字限制插件

2009/11/10 Javascript

jQuery拖动图片删除示例

2013/05/10 Javascript

js获取控件位置以及不同浏览器中的差别介绍

2013/08/08 Javascript

javascript框架设计读书笔记之种子模块

2014/12/02 Javascript

JavaScript encodeURI 和encodeURIComponent

2015/12/04 Javascript

jQuery实现简单隔行变色的方法

2016/02/20 Javascript

点击按钮出现60秒倒计时的简单js代码(推荐)

2016/06/07 Javascript

jQuery实现删除li节点的方法

2016/12/06 Javascript

JS设置时间无效问题的解决办法

2017/02/18 Javascript

使用bootstrap插件实现模态框效果

2017/05/10 Javascript

js+html5实现侧滑页面效果

2017/07/15 Javascript

ECMAScript6变量的解构赋值实例详解

2017/09/19 Javascript

原生js实现Flappy Bird小游戏

2018/12/24 Javascript

vue elementui el-form rules动态验证的实例代码详解

2019/05/23 Javascript

PyCharm下载和安装详细步骤

2019/12/17 Python

基于python3实现倒叙字符串

2020/02/18 Python

python GUI库图形界面开发之PyQt5拖放控件实例详解

2020/02/25 Python

python交互模式基础知识点学习

2020/06/18 Python

python使用列表的最佳方案

2020/08/12 Python

在python3.9下如何安装scrapy的方法

2021/02/03 Python

Speedo速比涛中国官方网站：全球领先泳装运动品牌

2018/04/24 全球购物

开放系统互连参考模型

2016/06/29 面试题

管理站站长岗位职责

2013/11/27 职场文书

2014年政风行风自查自纠报告

2014/10/21 职场文书

简单的离婚协议书范本

2014/11/16 职场文书

安全事故隐患排查治理制度

2015/08/05 职场文书

中学政教处工作总结

2015/08/13 职场文书

2016廉洁教育心得体会

2016/01/20 职场文书

go结构体嵌套的切片数组操作

2021/04/28 Golang