首页 >web前端 >html教程 > 正文

新手篇:如何用<a>标签制作一个链接(分享)

原创2021-07-30 17:15:4801369

之前的文章《手把手教你使用img标签添加图片效果(知识)》中,给大家介绍了怎样使用img标签添加图片效果。下面本篇文章给大家带了解一下如何创建<a>点击链接的方法,新手的伙伴们来看看吧。

<a>标签:在HTML中是超级链接标签,一般以“<a></a>”成对的形式出现。

<a>功能:就是跳转页面,通过单击一行文字跳转新页,它是HTML的核心功能。

href属性:指定链接地址,在<a>元素内部指定要显示的文字。

代码示例如下

<a href="//m.sbmmt.com">php中文网</a>

代码效果图如下

9.jpg

<a>不但可以包含文字,还可以包含其他元素,比如<h1>

代码示例如下

<a href="//m.sbmmt.com">
<h1>我是PHP中文</h1>
</a>

代码效果图如下

10.jpg

<a>可以包含图片(之前的文章有详细说图片元素)。

代码示例如下

<a href="//m.sbmmt.com">
<img src="https://img.php.cn/upload/image/682/458/838/1627535900680707.jpg" width="200" height="200">
</a>

代码效果图如下

11.jpg

单击上面任何一个链接,会发现新页面都会在当前页打开,当前页会被覆盖。有时我们不想谑当前页被覆盖掉,能不能让它在新标签页里打开呢?

没问题,我们可以用target属性指定单击跳转方式。

target属性:一共有以下几个值,其中前两项最常用

  • _blank:在新窗口中打开;

  • _self:默认。在相同的框架中打开;

  • _parent:在父框架集中打开;

  • _top:在整个窗口中打开。

parent和top两项涉及<iframe>元素,可以暂时忽略,一般我们只是经常用到target='_self'target='_blank',分别用于在当前页面打开,和在一个新的页面打开。

现在我给大家代码示例加上target=”_blank”

代码示例

<a href="//m.sbmmt.com"target=”_blank”>php中文网</a>

这个链接在视觉上不会有任何变化,但是单击它就会在新标签页中打开链接地址。

推荐学习:Html视频教程

以上就是新手篇:如何用<a>标签制作一个链接(分享)的详细内容,更多请关注php中文网其它相关文章!

php中文网最新课程二维码

声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理

  • 相关标签:html
  • 相关文章

    相关视频


    网友评论

    文明上网理性发言,请遵守 新闻评论服务协议

    我要评论
  • 专题推荐

    作者信息
    推荐视频教程
  • HTML前端基础第六部HTML前端基础第六部
  • HTML/CSS技术小知识每日分享HTML/CSS技术小知识每日分享
  • HTML 代码实例HTML 代码实例
  • 新独孤九贱之:HTML5极速入坑新独孤九贱之:HTML5极速入坑
  • 视频教程分类