切图中tab结构遇到的问题

 一开始用三个span放在一块,以为这样更方便,毕竟是行内嘛,都在一行,结果出现以下问题:

(1)

都是行内,所以current不好调,随意调节padding,height,其它都跟着动。

(2)

即使在怎么padding:0,margin:0,三个span之间多少还是有些默认距离,没办法无缝连接。

解决办法:

用ul li,都左float。一来li是块元素,二来浮动之后,之间无间隙啦。。

要注意ul li可以不给高,不给宽,只要给出内容就可以,因为有内容就有宽高啦,宽高就是字体的高,输入内容多少的宽,同时给一定的padding值,这样无论多少内容,字体和边框的间隙都是稳定不变化的。不要设什么margin来实现字体与边框的距离,因为到时候背景不好弄。。

注意:

所有的块级原素(行内原素span这些就不会),如div,p,li这些,如果没指定宽度,则默认都是充满父级容器的(不仅仅是内容的宽度),但是如果它们一旦设置了浮动,它们的宽度就是它们的内容,不会再充满。。

仅仅是受到浮动影响,而产生浮动效果,也仍然是要充满父级容器的,一定要自己设置了浮动才。。所谓的充满不会影响内容本身,该有多少内容还可以有多少内容,剩下的部分就充满。


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值