CSS的偽元素使用例子之一

hy_發表於2019-05-11

CSS的偽元素就是通過CSS來給標籤新增內容,預設標籤的內容是通過HTML來新增的

通常給偽元素的父級元素新增一個iconfont或者其他樣式:

<div class="wrapper">PANEL DEMO</div>複製程式碼

.wrapper {
	width: 140px;
	text-align: center;
	margin: 30px;
	position: relative;
}
.wrapper::after {
	content: '';
	position: absolute;
	bottom: -4px;
	left: -5px;
	height: 2px;
	width: 150px;
	background-color: #000;
}複製程式碼

偽元素根據父元素定位即可,效果:

CSS的偽元素使用例子之一


相關文章