CSS -webkit-fill-available【详解】

在CSS中，width:-webkit-fill-available 属性值是什么意思？下面IT备忘录小编就给大家详细的解答下。

width: -webkit-fill-available;

这个属性值需要分块理解。首先是：-webkit- ，这是一个前缀，浏览器厂商会在属性前加一个私有的前缀来支持新属性。这个前缀指能够在以webkit为内核的浏览器中正常使用。以webkit为内核的浏览器代表有safari和chrome，不过值得庆幸的是现在浏览器市场基本已实现大统一，国内大多浏览器都采用了：webkit内核，就连微软的Edge浏览器也放弃了IE，其次是 fill-available，是css的自适应关键字，其作用为撑满可用空间。

想让这个属性值在所有浏览器都生效，请参考如下写法：

.brand img {
    width: 100%;
    width: -moz-available;          /* WebKit-based browsers will ignore this. */
    width: -webkit-fill-available;  /* Mozilla-based browsers will ignore this. */
    width: fill-available;
}

以上就是IT备忘录小编给各位网站长提供的关于：width: -webkit-fill-available;关键字属性值的详细解答。

相关内容标签