TD元素的nowrap属性

    HTML中,在td建立时有个nowrap属性可以让我们来定义,这个属性究竟有什么用处,可以完成什么样的功能呢?

    HTML中td元素的nowrap属性表示禁止单元格中的文字自动换行。

  但使用时要注意的是,td元素noWrap属性的行为与td元素的width属性有关。如果未设置td宽度,则nowrap属性起作用的,如果设置了td宽度,则nowrap属性不起作用。

  nowrap详细解说:
  nowrap表示是否允许表格中的文本换行
  nowrap=true的时候不能换行
  nowrap=false可以换行

    且,结合自身经验,即使是表格设置了td的width属性,其实nowrap也是起了作用了的,即,在内容超过了td的宽度时,内容才会出现换行,并且防止td的宽度被挤压,保证td能够真实的占有其自身定义的width,如果此时行中Td的宽度之和大于表格的现有宽度了,那么表格会增加自身的宽度来适应td宽度之和,而不是由表格的宽度来限制td的宽度[不定义nowrap的情况是,td的宽度会被尽量挤压以适应表格的总宽度定义]

    比较经典的情况是: 比如现在有一个表格嵌套在一个可以有滚动条的Div层或者是iframe中,如果该表格的列数是不定的,而我们想要实现的效果是,如果表格的列数增加,那么就让表格的宽度也随着增加,如果表格的宽度超过了div层或iframe定义的宽度,那么就让div层或iframe出现滚动条,我们通过拖动滚动条来查看表格全部列的内容。此时如果我们不定义TD列的nowrap属性,那么表格的宽度就不会自动随着列数的增加而自动增加,他会在原有表格宽度的基础上,挤压其他的TD来放置新增加的Td,直到彻底无法挤压为止[如,各列都已成为单字宽,连续的字母或数字算作一个单字],此后才有可能去增加表格的宽度,即使我们不去人为的定义表格的总宽度,情况也是一样的,因为表格(table)在不定义宽度的情况下默认是宽100%的,这个时候,我们就需要对某一行[一般选作第一行]的所有td都定义nowrap="nowrap"或nowrap=true来防止td被挤压,实现列增加[或列的宽度增加]表格的宽度也增加的效果。

你可能感兴趣的:(Html&Div&Css)