父元素宽度被子元素宽度撑开max-content
css3提供了一个新特性,max-content.让父元素的宽度被子元素撑开.父元素宽度等于子元素
max-content
img和文字顶部对其(vertical-align:top)
下图中,通过控制台可以看到文字和图片是处于顶部对其的状态,为实现该效果,需要3个属性:line-height:1;display:inline-block写在span标签去掉文字默认上下距离,vertical-align:top写在img标签让图片和文字的对齐基准线在顶部
line-height:1的效果
未设置line-height:1;display:inline-block时可以看到,红线标出的文字自带的默认上下距离
设置line-height:1;display:inline-block时
vertical-align
用于img的属性设置元素的垂直对齐方式,默认是底部基准线,当设置为top的时候,文字和图片的基准线就位于顶部,如第一个图