设置el-dialog的高
时间: 2023-07-22 19:12:47 浏览: 53
可以通过设置 `el-dialog` 的 `height` 属性来控制其高度,例如:
```html
<el-dialog
title="Dialog Title"
:visible.sync="dialogVisible"
:height="400">
<!-- 对话框内容 -->
</el-dialog>
```
在上面的示例中,我们将 `el-dialog` 的 `height` 属性设置为 `400`,从而使其高度为 `400px`。你可以根据实际需要来设置 `height` 属性的值。
相关问题
el-dialog高度设置
要设置 el-dialog 的高度,可以使用 CSS 中的 height 属性。你可以在 el-dialog 的样式中设置 height 的值,例如:
```
<el-dialog style="height: 500px;">
<!-- 对话框内容 -->
</el-dialog>
```
你也可以使用 CSS 类来设置 el-dialog 的高度,例如:
```
<el-dialog class="my-dialog">
<!-- 对话框内容 -->
</el-dialog>
.my-dialog {
height: 500px;
}
```
除了使用 height 属性,你还可以使用 max-height 属性来限制 el-dialog 的最大高度,例如:
```
<el-dialog style="max-height: 500px;">
<!-- 对话框内容 -->
</el-dialog>
```
同样,你也可以使用 CSS 类来设置 el-dialog 的最大高度,例如:
```
<el-dialog class="my-dialog">
<!-- 对话框内容 -->
</el-dialog>
.my-dialog {
max-height: 500px;
}
```
设置el-dialog 的最高
根据引用中提供的代码和说明,可以看出要设置el-dialog的最高高度为100vh。在代码中通过添加max-height: 100vh !important;来实现这一效果。这样设置后,el-dialog的高度将不会超过浏览器窗口的可视高度。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [element ui 对话框el-dialog关闭事件详解](https://download.csdn.net/download/weixin_38660108/12763272)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"]
- *2* [element-plus:el-Dialog对话框组件垂直居中、禁止屏幕滚动、使用内滚动](https://blog.csdn.net/m0_58050016/article/details/128114632)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"]
- *3* [el-dialog层级不够高以及遮罩在内容框下面的问题](https://blog.csdn.net/Zxiuping/article/details/117153034)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"]
[ .reference_list ]
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)