【标准盒模型和怪异盒模型应用】输入框一边超出盒子范围

 做登录组件时，利用padding设置输入框与盒子左边的距离，右边却溢出。

原因是标准盒模型的width只是内容，不包括padding margin border

解决方法：

box-sizing: border-box

将盒子设置为怪异盒模型，此时width包含padding border  但仍旧不包括margin

修改后：

 知识点：标准盒模型与怪异盒模型

参考资料：【华为云全栈成长计划】CSS盒模型 — 标准盒模型和怪异盒模型-云社区-华为云 (huaweicloud.com)