
当我们与工作 HTML 和样式表 CSS 有时, 行为 我们正在设计的页面元素 是目前为止 你可能认为它将正确的事情. 在这些情况下, 我们不得不潜水 互联网 调查和询问他们放弃的可能 解决方案 这可以解决我们的问题.
在这种情况下, 我们要谈谈 行为 让他们 HTML 元素 当将它分配 填充. 假设你有一个元素 div 一个 宽度和高度的默认, 以像素为单位或百分比, 这给边缘更好地显示其尺寸:
正如你可以看到在 CSS 选项卡, 这个容器的 宽度 的一 75% 和一个人 高度 的 100 像素.
现在, 我们将指派 填充 的 20 像素 在每边:
我们可以看到,, 现在, 的 集装箱 提出了 填充 制作要分开边缘的文本, 但此外, 的 容器大小已经增加, 即, 现在有的高度和宽度的 40 更多的像素 由于 填充 分配给它的两侧.
为了避免这种, 我们将使用的属性 框大小 集装箱, 做如此 大小 同样的 包括 此外你 填充. 要做到这一点, 我们只需将值分配 框大小: 边界框 在 CSS 中, 并将得到以下结果:
以这种方式, 容器 将保持 的 填充 分配, 的 20 像素, 而不会增加 他们 尺寸 先前定义.
这只是为了表明, 元素,也会发生 输入 形式, 究竟是, 要匹配他们所需的设计, 我们应该有一点 技能.
我们要去 添加 元素 输入 的 键入文本 到 代码 我们已经有了, 和我们将配置 输入 一个 宽度 的的 100% 从父容器, 和 填充 的 5 像素 上部和下部方, 和 10 像素 为右和左.
会发生什么? 为我们的新 元素 输入 维度 从父容器, 甚至有他设置宽度 100%. 如何修复它? 因为同样的我们一样与其容器, 我们要去 他指派 该属性 框大小 值 边界框:
瞧 !! 在这里我们看到作为 使用 的 属性 框大小 并指派他 价值 边界框, 我们可以这样做 HTML 元素 我们的网站是 非常适合, 在 大小, 为您分配这些值, 避免 , 这些 成长 当 分配 某种类型的 填充 给他们.
