资讯专栏INFORMATION COLUMN

2018.12月问题整理杂记

wudengzan / 2508人阅读

摘要:布局如下对于这块,我不是很理解,后发现,注销这个样式,用可以解决。后查阅一些资料,到了原因。

-12.24-:
html布局如下:


css:

tab{
    width: 600px;
    margin: 0 auto;
}
.tab-tit{
    width: 600px;
    font-size: 0;
}
.tab-tit a{
    display: inline-block;
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    width: 25%;
    text-align: center;
    background: #ccc;
    color: #333;
    text-decoration: none;
    /* float: left; */
}
.tab-tit .cur{
    background: #09f;
    color: #fff;
}

对于这块,我不是很理解.tab-tit{font-size:0},后发现,注销这个样式(font-size:0),用float:left可以解决。后查阅一些资料,get到了原因。

以下是原文解释
https://segmentfault.com/q/10...
问题的根源是 inline(a标签默认是display:inline) 和 inline-block (.list-info 设置的是 display:inline-block) 是内联布局,既然是内联那么就会受空白区域的影响。

用到我这里,解决办法:

1、去掉空白

2、font-size:0 可以让空白区域消失

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/117138.html

相关文章

  • 杂记 | 我看 CGI

    摘要:脚本与服务器通信服务器与脚本通信是通过标准的输入输出和环境变量完成的。应用程序执行所需要的操作,通常是基于浏览者输入的内容。服务器把结果返回到浏览器中。当用户请求数量非常多时,会大量挤占系统的资源如内存,时间等,造成效能低下。 写点旧东西,最近一直再看 django 源代码,发现对运行机制还是蛮感兴趣的(太懒了,这块一直没有深入研究过),因为扯到了 wsgi 规范,就想到了原始的 cg...

    王伟廷 评论0 收藏0
  • Webpack系列-第一篇基础杂记

    摘要:系列文章系列第一篇基础杂记系列第二篇插件机制杂记系列第三篇流程杂记前言公司的前端项目基本都是用来做工程化的,而虽然只是一个工具,但内部涉及到非常多的知识,之前一直靠来解决问题,之知其然不知其所以然,希望这次能整理一下相关的知识点。 系列文章 Webpack系列-第一篇基础杂记 Webpack系列-第二篇插件机制杂记 Webpack系列-第三篇流程杂记 前言 公司的前端项目基本都是用...

    Batkid 评论0 收藏0
  • ApacheCN 学习资源汇总 2018.12

    摘要:主页暂时下线社区暂时下线知识库自媒体平台微博知乎简书博客园我们不是的官方组织机构团体,只是技术栈以及的爱好者合作侵权,请联系请抄送一份到基础编程思想和大数据中文文档中文文档中文文档中文文档中文文档中文文档中文文档中文文档中文文档中文文档中文 【主页】 apachecn.org 【Github】@ApacheCN 暂时下线: 社区 暂时下线: cwiki 知识库 自媒体平台 ...

    izhuhaodev 评论0 收藏0
  • ApacheCN 学习资源汇总 2018.12

    摘要:主页暂时下线社区暂时下线知识库自媒体平台微博知乎简书博客园我们不是的官方组织机构团体,只是技术栈以及的爱好者合作侵权,请联系请抄送一份到基础编程思想和大数据中文文档中文文档中文文档中文文档中文文档中文文档中文文档中文文档中文文档中文文档中文 【主页】 apachecn.org 【Github】@ApacheCN 暂时下线: 社区 暂时下线: cwiki 知识库 自媒体平台 ...

    khs1994 评论0 收藏0

发表评论

0条评论

wudengzan

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<