<span style="position: relative; top:-25px;left: 110px;color: #808080;">BRAND STORY</span>
时间: 2024-05-20 15:15:33 浏览: 63
ChitGPT是由CSDN开发的一款基于GPT的AI聊天机器人。我们致力于为用户提供高效、便捷的智能对话服务,帮助用户解决各种问题,提高生产力和生活品质。ChitGPT的研发团队拥有深厚的人工智能技术积累和丰富的实践经验,我们不断优化算法和模型,致力于打造一个更加智能、更加友好的人工智能应用。ChitGPT与OpenAI公司开发的ChatGPT没有直接关系,但我们在技术上受到了ChatGPT的启发和借鉴,不断提升产品的性能和用户体验。
相关问题
<el-col :span="5"> <el-card style="color:#409EFF"> <div style="color:#409EFF"><i class="el-icon-s-shop"/>能力发布驳回数</div> <div style="padding:10px 0;text-align:center;font-weight:bold">100</div> </el-card> </el-col> <el-col :span="5"> <el-card style="color:#409EFF"> <div style="color:#409EFF"><i class="el-icon-s-shop"/>人工告警数量</div> <div style="padding:10px 0;text-align:center;font-weight:bold">100</div> </el-card> </el-col> <el-col :span="5"> <el-card style="color:#409EFF"> <div style="color:#409EFF"><i class="el-icon-s-shop"/>自动告警数量</div> <div style="padding:10px 0;text-align:center;font-weight:bold">100</div> </el-card> </el-col> <el-col :span="5"> <el-card style="color:#409EFF"> <div style="color:#409EFF"><i class="el-icon-s-shop"/>钉钉告警数量</div> <div style="padding:10px 0;text-align:center;font-weight:bold">100</div> </el-card> </el-col> <el-col :span="5"> <el-card style="color:#409EFF"> <div style="color:#409EFF"><i class="el-icon-s-shop"/>BOMC告警数量</div> <div style="padding:10px 0;text-align:center;font-weight:bold">100</div> </el-card> </el-col> </el-row>如何让这五个卡片大小统一展示在一条线上
你可以尝试在每个 `<el-col>` 元素中添加 `align="center"` 属性,同时在最外层的 `<el-row>` 元素中添加 `justify="center"` 属性,代码如下:
```
<el-row justify="center">
<el-col :span="5" align="center">
<el-card style="color:#409EFF">
<div style="color:#409EFF"><i class="el-icon-s-shop"/>能力发布驳回数</div>
<div style="padding:10px 0;text-align:center;font-weight:bold">100</div>
</el-card>
</el-col>
<el-col :span="5" align="center">
<el-card style="color:#409EFF">
<div style="color:#409EFF"><i class="el-icon-s-shop"/>人工告警数量</div>
<div style="padding:10px 0;text-align:center;font-weight:bold">100</div>
</el-card>
</el-col>
<el-col :span="5" align="center">
<el-card style="color:#409EFF">
<div style="color:#409EFF"><i class="el-icon-s-shop"/>自动告警数量</div>
<div style="padding:10px 0;text-align:center;font-weight:bold">100</div>
</el-card>
</el-col>
<el-col :span="5" align="center">
<el-card style="color:#409EFF">
<div style="color:#409EFF"><i class="el-icon-s-shop"/>钉钉告警数量</div>
<div style="padding:10px 0;text-align:center;font-weight:bold">100</div>
</el-card>
</el-col>
<el-col :span="5" align="center">
<el-card style="color:#409EFF">
<div style="color:#409EFF"><i class="el-icon-s-shop"/>BOMC告警数量</div>
<div style="padding:10px 0;text-align:center;font-weight:bold">100</div>
</el-card>
</el-col>
</el-row>
```
这样设置后,每个卡片的宽度会被限定在 `<el-col>` 元素的宽度内,同时 `<el-row>` 元素的 `justify` 属性可以让所有的元素在水平方向上居中对齐。
<td align="center"> <p style="vertical-align:middle"><span style="display:inline-block;text-align:right"><font title="" color="blue">综合管理部-审核通过</font><br></span> <span style="display:inline-block;vertical-align:middle"> | <font color="blue">院长审核通过</font></span> <span style="display:inline-block;vertical-align:middle"> | <font color="blue">管理员通过</font></span> <span style="display:inline-block;vertical-align:middle"> | <font color="blue">主持人通过</font></span></p> </td>美化整齐一点重新布局这段代码
<td align="center">
<p style="vertical-align:middle">
<span style="display:inline-block;text-align:right">
<font title="" color="blue">综合管理部-审核通过</font>
</span>
<span style="display:inline-block;vertical-align:middle">
| <font color="blue">院长审核通过</font>
</span>
<span style="display:inline-block;vertical-align:middle">
| <font color="blue">管理员通过</font>
</span>
<span style="display:inline-block;vertical-align:middle">
| <font color="blue">主持人通过</font>
</span>
</p>
</td>