css 如何在锚标签中写入::before /::after

dhxwm5r4  于 2023-05-08  发布在  其他
关注(0)|答案(3)|浏览(250)

如何在锚标签中写::before。

eqqqjvef

eqqqjvef1#

你在这里看到的是一个CSS伪元素
::before伪元素可用于在元素内容之前插入一些内容。下面的代码将在每个段落之前插入This comes before...

p::before {
  content: "This comes before...";
}
<p>This is a paragraph</p>
<p>This is another paragraph</p>

有关CSS伪元素的更多信息,请参阅this链接。

qc6wkl3g

qc6wkl3g2#

在CSS2中使用,::before选择器在每个被选元素的内容之前插入一些内容。
使用content属性指定要插入的内容。
也有::after选择器用来在内容后面插入一些东西。
CSS

<style>
    p::before { 
    content: "User Name";
    background-color: yellow;
    color: red;
    font-weight: bold;
}
</style>


<body>

<p>Karthik N </p>
<p>Sachith MW </p>

</body>

输出将显示如下:)

z8dt9xmd

z8dt9xmd3#

::after::before称为psuedo elements
::after和::before允许您使用content属性向元素添加一些内容。

示例

a::before {
  content: " Before content";
  margin-right: 10px;
}
a::after {
  content: "After content";
  margin-left: 10px;
}
<a href="#">Click Here </a>

相关问题