CSS（層疊樣式表）是一種用于添加樣式和布局到 HTML 元素的語言。它可以通過不同的方式應(yīng)用于 HTML 元素，如內(nèi)聯(lián)樣式、內(nèi)部樣式表和外部樣式表。

在 CSS 中，我們可以通過添加子元素的方式來改變 HTML 元素的樣式和布局。添加子元素的方法主要有兩種：

方法一：使用偽元素
父元素::before {
content: "";  //添加空內(nèi)容
display: block; //轉(zhuǎn)換為塊級(jí)元素
height: 30px; //設(shè)置高度
width: 30px; //設(shè)置寬度
background-color: red; //設(shè)置背景顏色
}

上面的代碼中，我們通過添加 ::before 偽元素來給父元素添加一個(gè)紅色的方塊。

方法二：使用絕對(duì)定位
父元素 {
position: relative; //設(shè)置相對(duì)位置
}
子元素 {
position: absolute; //設(shè)置絕對(duì)位置
top: 50%; //設(shè)置上側(cè)距離為父元素一半高度
left: 50%; //設(shè)置左側(cè)距離為父元素一半寬度
transform: translate(-50%, -50%); //用于調(diào)整子元素位置
height: 30px; //設(shè)置高度
width: 30px; //設(shè)置寬度
background-color: red; //設(shè)置背景顏色
}

上面的代碼中，我們通過添加一個(gè)絕對(duì)定位的子元素來給父元素添加一個(gè)紅色的方塊。我們使用 transform 屬性來定位子元素的位置，使其水平和垂直居中。

通過上述兩種方法的其中一種或結(jié)合使用，我們可以很容易地給 HTML 元素添加一些有趣的效果。