css子元素高度百分比时的计算问题

        .child {
            /* box-sizing: border-box; */
            box-sizing: content-box;
            margin: 10px;
            padding: 10px;
            height: 100%;
            background-color: blue;
        }

1、子元素height: 100%, box-sizing: content-box时, 如果父元素 height: 600px时，那么子元素的content的高是600px, 当子元素的padding: 10px; margin: 10px;  子元素的实际高度是 640px

2、如果子元素的box-sizing: border-box时，子元素的实际高度是620px。（padding不计算在内）