box-size

<style>
*{ margin:0; padding:0; list-style:none; font-family:"\5FAE\8F6F\96C5\9ED1";}
.content_box{
    box-sizing:content-box;
    -webkit-box-sizing:content-box;
    width: 100px;
    height: 100px;
    padding: 20px;
    border: 5px solid #E6A43F;
    background: blue;
}
.padding_box{
  box-sizing:padding-box;
        -webkit-box-sizing:padding-box;
        width: 100px;
        height: 100px;
        padding: 20px;
        border: 5px solid #186645;
        background: red;
}
.border_box{
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
    width: 100px;
    height: 100px;
    padding: 20px;
    border: 5px solid #E6A43F;
    background: green;
}
</style>

火狐下的效果↓

aaarticlea/png;base64,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" alt="" />

chrome下的效果↓

aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMIAAAGgCAIAAAB3yC+DAAAFN0lEQVR4nO3YsU2kMRRGUZex3RDRCnVQDNFsUc5oYzYjGrFIXOnNb51PpwBL70Ze2+zXW9MPsBO29t6321/4jbX3/vx44dLu05PRCaYrktERpiuS0RGmK5LREaYrepTRWneenIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIXCAjLme6IhkdYboiGR1huiIZHWG6IhkdYbqi+9p7/3l75dKmK5LREaYrktERpiuS0RGmK5LREaYrepTR/Fc//yMjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAjIiICMCMiIgIwIyIiAjAhfIiMuZrkhGR5iuSEZHmK5IRkeYrkhGR5iu6L723p8fL/zQ9L2edDKSUTAZySiYjGQUTEYyCvYgo/W++CKjn0xGMgomIxkFk5GMgslIRsFkJKNgMpJRMBnJKJiMZBRMRjIKJiMZBZORjILJSEbBZCSjYDKSUTAZySiYjGQUTEYyCiYjGQWTkYyCyUhGwWQko2AyklEwGckomIxkFExGMgomIxkFk5GMgslIRsFkJKNgMpJRMBnJKJiMZBRMRjIKJiMZBZORjILJSEbBZCSjYDKSUTAZySiYjGQUTEYyCiYjGQWTkYyCyUhGwWQko2AyklEwGckomIxkFExGMgomIxkFk5GMgslIRsFkJKNgMpJRMBnJKJiMZBRMRjIKJiMZBZORjILJSEbBZCSjYDKSUTAZySiYjGQUTEYyCiYjGQWTkYyCyUhGwWQko2AyklEwGckomIxkFExGMgomIxkFk5GMgslIRsFkJKNgMpJRMBnJKJiMZBRMRjIKJiMZBZORjILJSEbBZCSjYDKSUTAZySiYjGQUTEYyCvYgI74xfa8nnYxkFExGMgomIxkFk5GMgq299/Qb7PKTkQWTkQWTkQWTkQWTkQWTkQWTkQWTkQWTkQWTkQWTkQWTkQX7B6xsruuBKOmzAAAAAElFTkSuQmCC" alt="" />

padding-box   只有在火狐下起作用