我在上设置了20px的高度<div>,但是当它在浏览器中呈现时,其高度仅为14px。
<div>
有任何想法吗?
<div style="display:inline; height:20px width: 70px">My Text Here</div>
您不能使用height和设置和width的元素display:inline;。使用display:inline-block;代替。
height
width
display:inline;
display:inline-block;
根据CSS2规范
10.6.1内联非替换元素 该height属性不适用。内容区域的高度应基于字体,但是此规范未指定如何。UA可以例如使用字体的em-box或最大升序和降序。(后者将确保在em- box上方或下方具有部分文字的字形仍位于内容区域内,但导致不同字体的大小不同的box;前者将确保作者可以控制相对于’line-height’的背景样式。 ,但会导致字形在其内容区域之外绘画。)
10.6.1内联非替换元素
该height属性不适用。内容区域的高度应基于字体,但是此规范未指定如何。UA可以例如使用字体的em-box或最大升序和降序。(后者将确保在em- box上方或下方具有部分文字的字形仍位于内容区域内,但导致不同字体的大小不同的box;前者将确保作者可以控制相对于’line-height’的背景样式。 ,但会导致字形在其内容区域之外绘画。)
编辑-您还缺少;该height属性的终止符:
;
<div style="display:inline; height:20px width: 70px">My Text Here</div> <!-- ^^ here -->