css样式关键词缩写ad在火狐浏览器中不显示bug

莉兹Liz

于 2021-08-05 11:34:57 发布

阅读量191

点赞数

分类专栏：前端样式

本文链接：https://blog.youkuaiyun.com/qq_40138556/article/details/119413628

版权

前端样式专栏收录该内容

14 篇文章

订阅专栏

本文讨论了在火狐浏览器中遇到的一个CSS样式关键词`ad`不显示的问题，原因是缩写可能被识别为`advertising`导致页面空白。解决方案是避免使用可能导致混淆的缩写。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

错误示范，页面空白

<div class="account-details">
	<div class="ad-text">
		Liz
	</div>
</div>
<style lang="scss" scoped>
.account-details {
	margin: 10px;
	display: flex;
	flex-wrap: wrap;
	.ad-text {
		color: pink;
	}
}
</style>

原因：account-details缩写ad，可能被浏览器识别为advertising（简写ad）

改为：

<div class="account-details">
	<div class="account-details-text">
		Liz
	</div>
</div>
<style lang="scss" scoped>
.account-details {
	margin: 10px;
	display: flex;
	flex-wrap: wrap;
	&-text {
		color: pink;
	}
}
</style>