zoukankan      html  css  js  c++  java
  • 关于div inlineblock的使用

    附:最近在做UML模式设计大作业,使用inline-block遇到了一些问题。

    (一)用inline 和 inline-block 设置行内元素

      两者都可用来设置某些元素为行内元素(如div、span等),但是两者存在区别。

        1、使用inline时,此元素会被显示为内联元素,元素前后没有换行符,这时,width属性对该元素无效。(该设置为默认设置)

        2、使用inline-block时,该元素被显示为行内块元素。(CSS2.1 新增的值)width属性才可以使用。

    (二)解决显示inline-block元素出现的空隙。

      使用某些浏览器,如chrome,显示inline-block元素时,将会出现4px的空隙。如下:

    解决的方法(具体见 这里 ):

    方法一:改写HTML文件结构

    <ul>
      <li>
      item1</li><li>
      item2</li><li>
      item3</li><li>
      item4</li><li>
      item5</li>  
    </ul>

    即,只要两个li元素间没有空格或换行符就行。

    方法二:使用负margin

    方法三:舍弃结束标签。如,丢掉上面的</li>

  • 相关阅读:
    BZOJ 1009 GT考试
    BZOJ 2085 [POI2010] Hamsters
    BZOJ 3160 万径人踪灭
    左偏树 / 非旋转treap学习笔记
    BZOJ 3217 ALOEXT
    BZOJ 3065 带插入区间第K小值
    BZOJ2716 天使玩偶
    XSY1659 [HNOI2012]永无乡
    BZOJ1367【Baltic2004】sequence
    蔡勒公式 计算星期
  • 原文地址:https://www.cnblogs.com/scutwang/p/3108502.html
Copyright © 2011-2022 走看看