怎么用css实现盒尺寸重置、均匀分布的子元素、截断文本

本篇内容介绍了“怎么用css实现盒尺寸重置、均匀分布的子元素、截断文本”的有关知识，在实际案例的操作过程中，不少人都会遇到这样的困境，接下来就让小编带领大家学习一下如何处理这些情况吧！希望大家仔细阅读，能够学有所成！

站在用户的角度思考问题，与客户深入沟通，找到龙南网站设计与龙南网站推广的解决方案，凭借多年的经验，让设计与互联网技术结合，创造个性化、用户体验好的作品，建站类型包括：成都做网站、成都网站建设、企业官网、英文网站、手机端网站、网站推广、申请域名、虚拟空间、企业邮箱。业务覆盖龙南地区。

盒尺寸重置

重置盒子模型，以便width s和height s并没有受到border 还是padding他们的影响 。

代码实现：

html {
  box-sizing: border-box;
}
*,
*::before,
*::after {
  box-sizing: inherit;
}

效果如下：

说明

box-sizing: border-box 添加padding 或者border 不影响元素的width 或者height 。
box-sizing: inherit 使元素尊重其父元素box-sizing 规则。
浏览器支持98.4 %，没有警告。

均匀分布的子元素

在父元素中均匀分布子元素。

代码实现：

  
Item1
  
Item2
  
Item3