el-main 里边内容没铺满解决办法

最新推荐文章于 2024-06-18 20:31:38 发布

原创最新推荐文章于 2024-06-18 20:31:38 发布 · 622 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#elementui

<el-main style="border:none;height:100%;width=100%;padding:0;margin:0;overflow-y:hidden">
              <iframe style="padding:0;border:0" :src="item.url" width="100%" height="100%" frameborder="0"></iframe>
</el-main>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

DASHACHUN

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

vue2 - 详细实现elementUI el-table 将表格布局自适应撑满页面高度（布局优化）

前端充电宝

03-01

5114

vue2详细实现elementUI el-table 将表格布局自适应撑满页面高度

解决Vue+Element UI 使用el-aside时菜单栏无法撑起整个侧边栏高度,解决点开菜单栏时有部分突起问题。

qq_59390336的博客

11-27

3891

解决Vue+Element UI 使用el-aside时菜单栏无法撑起整个侧边栏高度,解决点开菜单栏时有部分突起问题。

参与评论您还未登录，请先登录后发表或查看评论

elementui中main容器height显示为0，不能充满余下的整个页面（解决方法）

weixin_38345306的博客

03-07

1517

elementui中main容器height显示为0，不能充满余下的整个页面

＜el-main＞下div 填满

wmicn的博客

04-16

331

index.html中加入。在App.vue 下。

element ui的布局el-container布满整个页面

hcm15059080661的博客

05-02

2245

element ui的布局el-container布满整个页面

使用element UI中的el-container后h1标签字体大小不对？

不定期更新踩坑笔记及学到的知识点

01-04

1055

使用element UI中的el-container后h1标签字体大小不对，使用css重新定义大小

element UI 中间内容自动填充满屏

thinklog2018的博客

08-27

3286

element UI 设置容器布局时候比较方便，但如果设置不好会出现中间内容无法填充满整个屏幕剩余空间的问题，很可能会导致footer组件悬空在屏幕中间位置，不美观。根据网络上找到的资料，主要有如下几个步骤： 1. 首先说明下布局： header 、（aside，main) 、footer。中间aside和main在同一水平位置。 <template> <el-container> <el-header> head </el-hea..

怎么让el-container铺满el-card

04-09

<el-main>Main Content</el-main> <el-footer>Footer</el-footer> </el-container> </el-card> ``` #### CSS 样式为了让整个布局占据屏幕的全部空间，需要设置外层容器的高度为视口高度 (`100vh`) 并启用 ...

el-row 浏览器随便缩放页面高度永远铺满 css

最新发布

05-15

好的，用户的问题是关于使用el-row组件时，如何让页面高度随着浏览器窗口缩放始终铺满。他们希望使用Flexbox或Grid来实现，并且需要示例。首先，我需要回顾一下用户提到的el-row，这是Element UI中的布局组件，...

<template> <el-container> <index-header></index-header> <el-container> <index-aside></index-aside> <index-main></index-main> </el-container> </el-container> </template> <script> import IndexHeader from '@/components/index/IndexHeader' import IndexAside from '@/components/index/IndexAsideStatic' import IndexMain from '@/components/index/IndexMain' export default { components: { IndexHeader, IndexAside, IndexMain } } </script> <style lang="scss" scoped> // 铺满全屏 .el-container { position: absolute; width: 100%; top: 0; left: 0; bottom: 0; } </style>

05-30

这是一个 Vue.js 单文件组件，它的模板中使用了 ...在 <style> 标签中，使用了 SCSS 的语法定义了一个样式规则，将 el-container 元素铺满全屏。scoped 属性表示这个样式规则只作用于当前组件，避免了样式的全局污染。

element-plus的el-image预览图片无法全屏

黄彪博客

06-18

1920

在开发中，使用 el-image 控件查看图片详情，即放大图片，按照官方文档使用，结果发现图片详情无法全屏展示，如图。原因：el-carousel 滑动的效果就是利用了 CSS3 的。结论：查看图片详情是因为 CSS居中用的。备注：代码和上面一样，只是将。图片无法在浏览器居中展示。

Element ui 布局容器“el-main”的一个问题解决

热门推荐

秋刀山名鱼、

03-31

2万+

element ui提供了一个方便的Container 布局容器 <el-container>：外层容器。当子元素中包含<el-header>或<el-footer>时，全部子元素会垂直上下排列，否则会水平左右排列。 <el-header>：顶栏容器。 <el-aside>：侧边栏容器。 <el-main>：主...

点击侧边栏菜单跳转到main 页面

村长在路上

02-02

1252

因此需要判断获取路由路径如果是/home 路径则显示欢迎语(Devops管理系统) 如果不是则是路由占位符。前端依赖的后端接口字段 path, component。router.ts 中定义两个子菜单加载这两个页面。需要在 <el-main>标签下增加第一个路由占位符。因为登录的欢迎页面和点击下的子菜单会在同一个页面。.home.vue页面。home.vue 中。

ElementUI组件 el-main通过样式穿透去掉padding:20px

Dai_Aixy的博客

09-07

5695

ElementUI组件 el-main通过样式穿透去掉padding:20px

解决el-main没有撑满整个页面的问题

m0_46815188的博客

11-20

4520

el-main没有撑满整个页面是因为没有设置el-container高度为100% .el-container{ height:100%; }

使用elementui做后台管理系统，el-aside(el-menu)与el-main高度不一的问题，实现el-aside(el-menu)占满整个页面，以及实现多级菜单。

qq_51758070的博客

08-23

8045

先来看看问题1：（实现el-menu占满整个页面）这是el-menu没有设置高度出现的问题这是将el-menu这块高度设置为100vh，出现的问题最后，解决问题，如图在App.vue中，添加以下代码在布局文件中，也就是在以下文件中，给container类添加戴拿最后，也就是在el-main里面，即TabInner里面添加以下代码问题2：实现多级菜单做法：遍历从父组件传过来的menuData数组数据（菜单栏数据），如果数据里有children属性，则建立一个父级菜单名，并再次循环去判断

el-aside侧边栏无法铺满全屏

zfldongcidaci的博客

04-13

9667

element-ui的el-aside侧边栏是自动扩展的，不是铺满全屏的，所以怎么固定铺满全屏那？参考了该博客：参考的原博客地址。方法如下： 1.在App.vue中，style里写： #app { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } 2.在container中style里写： .el-aside { ...