FED

©FrontEndDev.org
2015 - 2024
web@2.22.0 api@2.20.0

css3 box-sizing 最佳实践

css3 box-sizing 最佳实践

/* apply a natural box layout model to all elements, 
but allowing components to change */
html{
    box-sizing:border-box;
}
*, 
*:before, 
*:after{
    box-sizing:inherit;
}

组件需要重置时,只需在组件容器上重置即可:

.component {
    /* designed to work in default box-sizing */
    /* in your page, you could reset it to normal */
    box-sizing: content-box;
}

参考资料