css中的偽元素,我今天記住了!o yeah

2021-10-05 05:38:19 字數 758 閱讀 6718

先上張,畢竟有圖有真相嘛~

檢視第一張圖(html)紅色方框中只有兩個元素,乙個div元素和p元素;在第二張圖(css)通過新增乙個:after偽類元素的方式,新增乙個白色三角形,來達到最終的效果。下面是我的:

第一張圖(html)紅色方框中也是兩個元素,兩個div,第二個div新增了乙個********的class;第二張圖的css**沒有進行修改,只是去掉了了乙個position:absolute。

那麼偽元素是什麼?有什麼用是不是就體現出來了?我的理解是:通過偽元素可以新增乙個在html**中「看不到的html」元素,但在瀏覽器頁面能夠看到效果。如上面兩個例子最終呈現的效果是一樣的。

CSS中的偽元素

nth child 是乙個css3偽元素,它會根據指定的選擇器選定頁面或父元素的第n個元素 示例 在下面的例子中,我們選中頁面中的第二段 p nth child 2 也可以選定div中的第二段或者列表中的第二項 div p nth child 2 ul li nth child 2 還可以使用 nt...

css中的偽類和偽元素

一 css偽類 pseudo class 是用來新增一些選擇器的特殊效果。由於狀態的變化是非靜態的,所以元素達到乙個特定狀態時,它可能得到乙個偽類的樣式 當狀態改變時,它又會失去這個樣式。由此可以看出,它的功能和class有些類似,但它是基於文件之外的抽象,所以叫偽類。偽類的語法 selector ...

CSS中的偽類和偽元素

2019獨角獸企業重金招聘python工程師標準 偽類與類相似,但又沒有類附加標籤上。偽類分為ui偽類和結構化偽類。偽元素是在文件中若有實無的元素。主要有以下幾種 看到 after,大家腦子裡應該都能浮現出那個清除浮動的css的吧。沒錯,就是這個。clearfix after仔細琢磨下它們的定義。偽...