子組件上下結構布局自適應父組件寬度高度


1、父級頁面

<template>
  <div>
    <div class="parentDiv">
      <!-- gys-org-navigator 在這里是全局注冊組件 -->
      <gys-org-navigator ref="orgNavigator" :org-tree="orgTree" :org-id="orgId" :org-type="orgType" @select="doSelect" />
    </div>
  </div>
</template>
<style scoped>
  .parentDiv{
      width: 220px;
      height: 600px;
  }
</style>
View Code

2、子組件頁面內容

css部分內容:

<template>
  <div>
    <div class="query-search"></div>
    <div class="tree-list-warp-panel"></div>
  </div>
</template>
<style scoped>
.query-search {
    position: relative;
    background: #fff;
    z-index: 9;
}
.tree-list-warp-panel {
    position: absolute;
    top: 35px;
    min-height: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
}
</style>
    

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



猜您在找 CSS - 父元素寬度自適應子元素寬度之和 css--常見左右盒子寬度高度自適應布局 iframe 高度寬度自適應 子元素絕對定位,父元素高度自適應子元素高度 div高度自適應(父元素未知,所有高度跟隨子元素最大的高度) 【HTML-進階-如何實現父級塊級元素寬度自適應子元素寬度】 CSSHTML實現高度寬度自適應