在后台管理系統項目中，經常會使用element-ui中的組件el-table（表格）來展示列表數據。
當展示數據的時候，可能就需要給給某一行或者列設置特殊的樣式，在查詢文檔是我遇到了一些問題：包括設置某一行或列樣式的方式；包括設置指定類名后選擇器無效問題。。。。
首先介紹一下，我的項目需求是列表中展示詳細信息的一列，最多只展示兩行數據，超出時使用...表示。
實現結果如下圖所示：
下面介紹一下實現方式：
方法一（不推薦，復雜、而且表格稍有錯位）：
1.查閱element-ui官方文檔后我們發現有如下屬性：
2.為表格添加該屬性，並指定函數名：
3.在methods中定義addClass方法，給“詳細信息”列添加類名：
4.在<style></style>中設置指定css樣式：
在經過以上步驟后，本以為就應該是實現了需求，但是查看頁面后發現，並沒有成功！！！！！
這時點開控制台發現，類名已經添加成功了，但是選擇器樣式卻無效。。。。。。
害我查了好久的資料o(╥﹏╥)o，才知道有以下解決辦法——使用全局屬性：
在elementUI中，row-class-name、row-style、cell-class-name等屬性要想生效必須使用全局class才能生效。因為之前的代碼都是在組件中編寫的，所以去除中的scoped即可該組件中的樣式變為全局屬性。
再看上面的代碼，我將選擇器定義在了局部：
5.修改為全局樣式：
所以就再單獨寫一個<style></style>標簽書寫全局樣式即可：
至此，我們就實現了預期的效果： 
方法二（推薦，簡單且顯示正常）：
下面我們介紹一種簡單易行的方法——使用<template></template>
如上圖所示，使用<template></template>並給其添加scope屬性，再內嵌一層設置有相應類名的<span></span>包裹要展示的內容。當然，編寫相應的CSS屬性選擇器也是必須的，與方法一選擇器內容相同。
這樣就可以了，超級簡單！！！效果圖就不展示了，反正沒有錯位~~~