如何扩展li元素以填充其父元素ul的100%？

要扩展li元素以填充其父元素ul的100%，可以使用CSS中的flexbox布局或者grid布局来实现。

使用flexbox布局的方法如下：

1. 将ul元素的display属性设置为flex，这样ul元素就变成了一个flex容器。
2. 将ul元素的flex-direction属性设置为column，使得li元素在垂直方向上排列。
3. 将li元素的flex属性设置为1，使得li元素能够平均分配剩余空间。

示例代码如下：

ul {
  display: flex;
  flex-direction: column;
}

li {
  flex: 1;
}

使用grid布局的方法如下：

1. 将ul元素的display属性设置为grid，这样ul元素就变成了一个grid容器。
2. 将ul元素的grid-template-rows属性设置为"repeat(auto-fill, 1fr)"，使得li元素在垂直方向上平均分配剩余空间。

示例代码如下：

ul {
  display: grid;
  grid-template-rows: repeat(auto-fill, 1fr);
}

以上两种方法都可以实现li元素填充其父元素ul的100%的效果。具体选择哪种方法取决于实际需求和布局结构。

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

• 腾讯云官网：https://cloud.tencent.com/
• 云服务器（CVM）：https://cloud.tencent.com/product/cvm
• 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
• 云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
• 云存储（COS）：https://cloud.tencent.com/product/cos
• 腾讯云区块链服务（TBC）：https://cloud.tencent.com/product/tbc