iview card布局

js:

div id="app">
    <row style="background:#eee;padding:20px">
        <i-col span="4">
            <card >
                <p slot="title" align="center">工號:F2845816</p>
                <p slot="title" align="center"> 姓名:大廈將顛</p>
               
                <image src="http://10.132.241.214:8888/employee/F2845816/avatar" class="aa">
                </image>
            </card>
        </i-col>
        
         <i-col span="4" offset="1">
            <card :bordered="false">
                <p slot="title" align="center">工號:F2845816</p>
                <p slot="title" align="center"> 姓名:大廈將顛</p>
               
                <image src="http://10.132.241.214:8888/employee/F2845816/avatar" class="aa">
                </image>
            </card>
        </i-col>
        
         <i-col span="4" offset="1">
            <card :bordered="false">
                <p slot="title" align="center">工號:F2845816</p>
                <p slot="title" align="center"> 姓名:大廈將顛</p>
               
                <image src="http://10.132.241.214:8888/employee/F2845816/avatar" class="aa">
                </image>
            </card>
        </i-col>
        
         <i-col span="4" offset="1">
            <card :bordered="false">
                <p slot="title" align="center">工號:F2845816</p>
                <p slot="title" align="center"> 姓名:大廈將顛</p>
               
                <image src="http://10.132.241.214:8888/employee/F2845816/avatar" class="aa">
                </image>
            </card>
        </i-col>
        
         <i-col span="4" offset="1">
            <card :bordered="false">
                <p slot="title" align="center">工號:F2845816</p>
                <p slot="title" align="center"> 姓名:大廈將顛</p>
               
                <image src="http://10.132.241.214:8888/employee/F2845816/avatar" class="aa">
                </image>
            </card>
        </i-col>
        </row>
        
        
</div>

css:

.aa{
  height:100%;
  width:100%;
}

运行结果:

猜你喜欢