Mwongozo wa ::after wa CSS

定义和用法

CSS ::after 伪元素用于在指定元素的内容之后插入一些内容。

使用 content 属性指定要插入的内容。content 的值可以是:

  • 字符串:content: "Hello world!";
  • 图片:content: url(myimage.jpg);
  • 无内容:content: none;
  • 计数器:content: counter(li);
  • 引号:content: close-quote;
  • 属性值:content: " (" attr(href) ")";

提示:请注意,插入的内容仍然位于指定元素内部。插入的内容会添加到元素内部的其他内容之后。

使用 ::before 在特定元素的内容之前插入一些内容。

Mfano

Mfano 1

Wingiza heri stringi kwa kila kitu cha <p> cha kipenyo:

p::after {
  content: " - Tazama hii";
}

Mfano wa kufia

Mfano 2

Wingiza heri stringi kwa kila kitu cha <p> cha kipenyo kwa kumaliza kufia na kumkinga stili ya kufia:

p::after {
  content: " - Tazama hii";
  background-color: yellow;
  color: red;
  font-weight: bold;
}

Mfano wa kufia

Makadara ya CSS

::after {
  maudhui ya css;
}

Vivutio ya ujuzi

Toleo: CSS2

Mafanikio ya kifungaji

Mafanikio ya kufungua kwenye vifungu vya mtandao vya kina vya CSS inatokana na cheo cha kwanza cha kufungua kwa kina hii mbinu.

Chrome Edge Firefox Safari Opera
4.0 9.0 3.5 3.1 7.0

Sayari ya hali

Mafunzo:CSS mbinu ya kina

Matokeo:Mwongozo wa CSS ::before