relative 的範例 - daniel-qa/Vue GitHub Wiki

relative 的範例

擺脫 el-elment 的位置綁架

<div v-if="activeIndex !== null" class="list2 parent">    
    <!-- 搜尋框 -->
    <el-input v-model="searchQuery"
                placeholder="搜尋子項目..."
                size="medium"
                clearable
                class="child"
                style="width:350px;top:30px;"></el-input>
    <!-- 学校列表 -->    
    <div class="list child" style="height: 82%;top:95px;width:350px;">
        <div v-for="(subItem, subIndex) in filteredSubItems"
                :key="subIndex"
                :class="{'active': activeIndex2 === subIndex}"
                class="list-item"
                @click="setActive2(subIndex)">
            {{ subItem.name }}
            {{ subItem.tchCnt }} 人
            <el-button size="small" @click.stop="addToColumn3(subItem)" type="success">加入</el-button>
        </div>
		
    </div>
</div>
.parent {
    position: relative; /* 父元素設置為 relative */
}
.child {
    position: absolute; /* 子元素設置為 absolute */
    top: 20px;
    left:20px;
}
⚠️ **GitHub.com Fallback** ⚠️