让网页中所有链接都新开标签来打开

如何通过简单的代码设置,让你网页中的超链接都是用新页面标签来打开,而不用一个一个链接去修改?

网站建设在这里给你教一下非常简单的操作方法:

如果要在新选项卡中打开文档中的所有链接,则可以使用<base>element:

 

网站建设

网站建设

HTML代码

<!– This link will open in a new tab. –>
<div class="wrapper">This link will be opened in a new tab:
<a href="https://freecodetools.org/">
Free Code Tools
</a>Read more:
<a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base">
MDN Documentation
</a></div>

 

CSS代码

/* Please ❤ this if you like it! */

.wrapper {
text-align: center;
padding: 0 15px;
background-color: #173446;
color: white;
display: flex;
flex-direction: column;
height: 100vh;
justify-content: center;
align-items: center;
font-size: 1.4em;
}

a {
color: #999;
position: relative;
}

a:after {
background-color: #999;
bottom: 0;
content: "";
height: 1px;
left: 0;
position: absolute;
transform: scaleX(0);
transition: all .3s ease-in-out 0s;
visibility: hidden;
width: 100%;
}

a:hover:after {
transform: scaleX(1);
visibility: visible;
}

原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/262134.html

(0)
上一篇 2022年5月25日
下一篇 2022年5月25日

相关推荐

发表回复

登录后才能评论