CSS flex未将宽度从%1更改为%2或%3

CSS flex是一种用于布局的弹性盒子模型，它可以帮助开发人员更灵活地设计和排列网页元素。通过使用flex属性，可以轻松地调整元素的宽度和高度，以适应不同的屏幕尺寸和设备。

在CSS中，flex布局有三个主要的属性：flex容器、flex项目和flex项。

1. Flex容器：
   • 概念：flex容器是包含了一组flex项目的父元素。
   • 分类：flex容器可以是块级元素或行内元素。
   • 优势：使用flex容器可以实现响应式布局，自适应不同屏幕尺寸；简化了布局代码，减少了使用float和position属性的需求；可以轻松实现水平和垂直居中等布局效果。
   • 应用场景：适用于各种网页布局，特别是需要适应不同屏幕尺寸的响应式设计。

• Flex项目：
  • 概念：flex项目是flex容器中的子元素。
  • 分类：flex项目可以是任何HTML元素。
  • 优势：使用flex项目可以通过调整宽度和高度来实现灵活的布局；可以通过设置flex-grow、flex-shrink和flex-basis属性来控制项目的伸缩性；可以使用order属性来改变项目的顺序。
  • 应用场景：适用于构建复杂的网页布局，特别是需要灵活调整元素位置和大小的场景。
• Flex项：
  • 概念：flex项是flex项目中的内容。
  • 分类：flex项可以是文本、图像或其他HTML元素。
  • 优势：使用flex项可以通过设置宽度、高度、边距和填充等属性来控制内容的样式和布局。
  • 应用场景：适用于各种网页内容的布局和排列。

腾讯云相关产品和产品介绍链接地址：

• 腾讯云弹性伸缩（Auto Scaling）：https://cloud.tencent.com/product/as
• 腾讯云容器服务（Tencent Kubernetes Engine）：https://cloud.tencent.com/product/tke
• 腾讯云云服务器（CVM）：https://cloud.tencent.com/product/cvm
• 腾讯云云数据库MySQL版（TencentDB for MySQL）：https://cloud.tencent.com/product/cdb_mysql
• 腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos
• 腾讯云区块链服务（Tencent Blockchain as a Service）：https://cloud.tencent.com/product/baas
• 腾讯云人工智能（AI）：https://cloud.tencent.com/product/ai
• 腾讯云物联网（IoT）：https://cloud.tencent.com/product/iot
• 腾讯云移动开发（Mobile Development）：https://cloud.tencent.com/product/md
• 腾讯云音视频处理（VOD）：https://cloud.tencent.com/product/vod
• 腾讯云云原生应用引擎（Cloud Native Application Engine）：https://cloud.tencent.com/product/tna