CSS :after伪类选择器--文本到底添在哪儿

最新推荐文章于 2023-02-22 23:11:32 发布

今天也是爱大大的一天吖

最新推荐文章于 2023-02-22 23:11:32 发布

阅读量248

点赞数 1

分类专栏： CSS 文章标签： css

本文链接：https://blog.csdn.net/qq_45560350/article/details/106620975

版权

CSS 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

:after选择器向选定的元素之后插入内容。
使用content属性来指定要插入的内容。

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>
<style>
	div{
		width: 200px;
		height: 200px;
		border: 1px solid red;
	}
	span{ 
		border:1px solid yellow;
	}
	div:after,
	a:after,
	span:after{
		content: "aha";
		background-color: #eee;
		color: fff;
		font-size: 30px;
	}

</style>
<body>
    <div>i love css</div>
    <a href="/">aha</a>
    <span>hh</span>
</body>
</html>

效果图
在这里插入图片描述

注意是在div、a、span标签中的末尾添加的文本而不是在标签外添加

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

今天也是爱大大的一天吖

关注关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
CSS :after伪类选择器--文本到底添在哪儿

:after选择器向选定的元素之后插入内容。使用content属性来指定要插入的内容。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></hea
复制链接

扫一扫