empty偽類和 only child偽類

emptymdn 介紹

empty css 偽類 代表沒有子元素的元素。子元素只可以是元素節點或文字（包括空格）。注釋或處理指令都不會產生影響。

// html

="empty-content"
>
<
/div>
="empty-content"
>
愛江山更愛美人<
/p>
<
/div>
// css
.empty-content:empty
.empty-content:empty:before此時的檢視
在日常開發中可能用到佔位符 但是通常是空元素，此時使用empty可以很好的節省我們的開發時間
比如姓名：
年齡：

姓名：<

/label>
="empty-content"
>
<
/span>
年齡：<
/label>
="empty-content"
>
<
/span>
// css
.empty-content:empty:before

姓名：暫無資料

年齡：暫無資料

css偽類:only-child 匹配沒有任何兄弟元素的元素.等效的選擇器還可以寫成 :first-child:last-child或者:nth-child(1):nth-last-child(1),當然,前者的權重會低一點

// html

="only"
>radioactive<
/p>
<
/div>
="only"
>radioactive<
/p>
="only"
>imagine dranons<
/p>
<
/div>
// css 
.only:only-child檢視
先這樣吧 散會散會 幹活了

使用 empty 偽類優化 Render 結構

在我們的 中，經常有這樣的 const this.props const listitmes list.map return ul 複製 skeleton 在antd 中 3.9.2 新增 用來在需要等待載入內容的位置提供乙個佔位圖。在我們的系統中，經常有資料判空的情況，如果antd 公升級之後能有...

偽類和偽元素

偽元素 first letter向文字的第乙個字母新增特殊樣式 first line 向文字的第一行新增樣式 before 在元素之前新增內容 after 在元素之後新增內容 偽類 link 未被訪問的鏈結 visited 已訪問的鏈結 hover當滑鼠懸停到元素上方時 active被啟用的元素 注...

偽類和偽元素

定義 偽類和偽元素就是為文件中不一定存在的結構指定樣式，或者為某些元素 甚至文件本身 的狀態所指示的幻象類指定樣式。css引入偽類和偽元素概念是為了格式化文件樹以外的資訊。偽類的形式 選擇符 偽類 偽元素的形式 選擇符 偽元素 css3規範中要求使用雙冒號 表示偽元素，以此來區分偽元素和偽類。鏈結偽...