:first-line偽元素用於向文本的首行設置特殊樣式,只能用於塊級元素
:first-letter偽元素用於向文本的首字母設置特殊樣式
:before在元素的內容前面插入新的內容
:after在元素的內容后面插入新的內容
1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title>css選擇器之偽元素選擇器</title> 8 <style type="text/css"> 9 p:first-letter{ 10 font-size: 100%; 11 } 12 p:after{ 13 content:'';/*這個屬性不能省略,如果省略,該屬性不起作用*/ 14 width:20px; 15 height: 20px; 16 background-color: #000000 17 } 18 </style> 19 </head> 20 <body> 21 <p>前端開發是創建Web頁面或app等前端界面呈現給用戶的過程，通過HTML，CSS及JavaScript以及衍生出來的各種技術、框架、解決方案，來實現互聯網產品的用戶界面交互 [1] 。它從網頁制作演變而來，名稱上有很明顯的時代特征。在互聯網的演化進程中，網頁制作是Web1.0時代的產物，早期網站主要內容都是靜態，以圖片和文字為主，用戶使用網站的行為也以瀏覽為主。隨着互聯網技術的發展和HTML5、CSS3的應用，現代網頁更加美觀，交互效果顯著，功能更加強大。</p> 22 </body> 23 </html>