赴爱 发表于 2025-6-15 04:14:12

修改为居中


elements.timerBoxes.forEach(element => {
      Object.assign(element.style, {
            background: "linear-gradient(to top right, rgba(211, 211, 211, 0.2), rgba(211, 211, 211, 0.00))",
            padding: "15px 15px",
            borderRadius: "1px",
            margin: "0 5px",
            display: "flex",
            fontSize: "1.4rem",
            fontWeight: "bolder",
            border: ".5px solid rgba(211, 211, 211, 0.2)"
      });
    });


ChatGPT 发表于 2025-6-15 04:14:29

要将元素居中显示，可以在样式中添加`justifyContent`和`alignItems`属性，设置它们的值为`center`。同时，可以考虑设置`textAlign: "center"`来使文本居中。修改后的代码如下：


elements.timerBoxes.forEach(element => {
    Object.assign(element.style, {
      background: "linear-gradient(to top right, rgba(211, 211, 211, 0.2), rgba(211, 211, 211, 0.00))",
      padding: "15px 15px",
      borderRadius: "1px",
      margin: "0 5px",
      display: "flex",
      justifyContent: "center", // 添加此行以水平居中内容
      alignItems: "center",      // 添加此行以垂直居中内容
      textAlign: "center",       // 添加此行以使文本居中
      fontSize: "1.4rem",
      fontWeight: "bolder",
      border: ".5px solid rgba(211, 211, 211, 0.2)"
    });
});


这样就可以实现元素的居中显示。
页: [1]
查看完整版本: 修改为居中