在CSS中,我們可以使用content
屬性來(lái)添加內(nèi)部鏈接。content
屬性允許我們插入一些文本,包括鏈接,到元素中,以下是一個(gè)簡(jiǎn)單的例子:
a:before { content: "鏈接: "; }
在這個(gè)例子中,我們使用了a:before
偽元素來(lái)在每個(gè)鏈接之前添加一段文本。content
屬性的值就是我們要添加的文本。
如果我們想要在每個(gè)鏈接之后也添加一段文本,我們可以使用a:after
偽元素:
a:after { content: " (鏈接)"; }
這樣,每個(gè)鏈接之后就會(huì)跟著一段括號(hào)內(nèi)的文本,內(nèi)容為“鏈接”。
需要注意的是,使用content
屬性添加的文本并不會(huì)實(shí)際改變鏈接的href
屬性,也就是說(shuō),點(diǎn)擊這些添加的文本并不會(huì)跳轉(zhuǎn)到相應(yīng)的鏈接地址,如果想要讓用戶能夠點(diǎn)擊這些文本進(jìn)行跳轉(zhuǎn),我們需要使用JavaScript來(lái)實(shí)現(xiàn)。
如果鏈接本身已經(jīng)有了一段文本,那么content
屬性會(huì)在鏈接的文本前后分別添加文本,如果想要替換鏈接的文本,我們可以使用text-decoration
屬性:
a { text-decoration: none; content: "鏈接"; }
在這個(gè)例子中,鏈接的文本被替換為“鏈接”,并且去掉了原有的下劃線裝飾。