题目概览
- 对HTML5的img标签属性srcset和sizes的理解
- display:inline-block在什么时候会显示间隙
- var x, y = 1; x + y = ?
题目解答
对HTML5的img标签属性srcset和sizes的理解
-
srcset
:规定了图片的src
候选集;
-
sizes
:规定了图片在不同条件下的尺寸取值,根据尺寸取值从srcset
中找到对应的图片src
;配合srcset
属性才能使用;
- 如果没有设置srcset属性,或者没值,那么sizes属性也将不起作用
- 应用场景:多用于响应式图片或不同像素密度设备的图片适配;
- 参考文档:响应式图片srcset全新释义sizes属性w描述符
display:inline-block在什么时候会显示间隙
- 在CSS布局中,如果想要将一些元素在同一行显示,其中的一种方法就是把要同行显示的元素设置display属性为inline-block,但是会发现这些同行显示的inline-block元素之间经常会出现一定的空隙,这就是“换行符/空格间隙问题”
- 解决办法:
- 移除两个元素之间的空格
- 使用margin负值
- 全局使用font-size:0
var x, y = 1; x + y = ?
x // => undefined
y // => 1
x + y // => undefined + 1 => NaN