a[target="_blank"]{ display: inline-block; position: relative; overflow: hidden; } a[target="_blank"]::after{ content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 999; } a[target="_blank"]:hover::after{ background-color: rgba(0,0,0,.2); }
以上CSS代码实现了在链接中添加了target=”_blank”属性后,当用户点击链接时会在新的标签页中打开链接内容,并且在原来的标签页中添加了一个半透明蒙层,提高用户体验。
在实际应用中,大家可以将以上CSS代码应用到网站的不同链接中,让用户可以更方便地在新的标签页中打开相关内容。同时,大家也可以根据自己的需求对CSS代码进行调整,实现更加个性化的效果。