vue圖片顯示圓形

列表的圖片顯示：

<el-table-column prop="headUrl" label="用戶頭像" >
                <!-- 圖片的顯示 -->
                <template   slot-scope="scope">
                    <div>
                        <img :src="scope.row.headUrl" style="height: 40px;border-radius: 50%"/>
                    </div>
<!--                    <el-image-->
<!--                            style="width: 128px; height: 128px; border-radius: 50%;"-->
<!--                            :src="scope.row.headUrl"-->
<!--                            :fit="fits">-->
<!--                    </el-image>-->
                </template>
            </el-table-column>

詳情的圖片顯示：

<td style="width: 25%">用戶頭像：
                    <el-image
                        style="width: 128px; height: 128px; border-radius: 50%;"
                        :src="task.headUrl"
                        :fit="fits">
                    </el-image>
                </td>