前端第二章:8.HTML超链接代码写法;id属性

前端第二章:8.HTML超链接代码写法;id属性一、超链接介绍0.超链接是行内元素,但是可以放块元素1.从一个页面跳转到另一个页面2.或者跳转到当前页面的其他位置3.href属性的值可以是外部网站,也可以是同一个目录下的地址文件,如xxx.html二、超链接·代码1.超链接写法:<ahref=”你想要跳转到的网址”>超链接的字样</a>2.示例(外部网站和同一个目录下的html都可以写进href名值对结构中):3.浏览器内显示(紫色字样表示你最近访问过,蓝色代表没有访问过):4.

大家好,又见面了,我是你们的朋友全栈君。

一、超链接介绍

0.超链接 是 行内元素,但是可以放 块元素
1.从一个页面跳转到另一个页面
2.或者跳转到当前页面的其他位置
3.href 属性的值可以是 外部网站,也可以是同一个目录下的地址文件,如 xxx.html

二、超链接·代码

1.超链接写法:

<a href="你想要跳转到的网址"> 超链接的字样 </a>

2.示例(外部网站 和 同一个目录下的html 都可以写进href名值对结构中):
在这里插入图片描述

3.浏览器内显示(紫色字样表示你最近访问过,蓝色代表没有访问过):
在这里插入图片描述
4.访问一下同一目录下的 hello.html 页面吧!
在这里插入图片描述

三、超链接名值对 target · 代码

1.在当前界面打开超链接(target名值对默认值)

<a href="你想要跳转到的网址" target="_self"> 超链接的字样 </a>

2.在新标签页打开超链接

<a href="你想要跳转到的网址" target="_blank"> 超链接的字样 </a>

四、超链接回到当前页面顶部 · 代码

1.当阅览比较长的文章时,可以通过一个超链接直接回到当前页面顶部

<a href="#">回到顶部</a>

2.页面效果(点击就会回到顶部)
在这里插入图片描述

五、id属性 · 代码

0.id 应该是字母开头

1.id属性有点类似于 goto,是一个可以定位的 goto

2.我们能够给一个元素添加id属性,但是一个html文件中,id值不能重复(而且id属性区分大小写)

3.我们几乎能给任何一个标签添加 id属性,示例:
在这里插入图片描述

4.跳转到 指定id 的位置(靠这个我们能跳转到当前页面的任何位置!goto万岁):

<a href="#标签名">超链接的名称</a>

六、什么都不会做的超链接 · 代码

1.也许是个有用的功能吧… 也许…
2.下面的代码可以保证你点击超链接之后什么都不会发生:

<a href="javascript:;">超链接的名字</a>

七、超链接·易错点

1.超链接元素内 不能嵌套 超链接本身
2.在写代码时不要忘记超链接中间的 标签体!否则你会在网页中看不见超链接
3.href 名值对的值可以使用 相对路径进行访问,写法和 linux 中一样

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/158327.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 几种开源分词工具的比較

    几种开源分词工具的比較

    2021年12月16日
    35
  • 谷歌离线地图Api附获取教程[通俗易懂]

    谷歌离线地图Api附获取教程[通俗易懂]GoogleMapAPIV3来自:https://www.cnblogs.com/liongis/archive/2011/04/28/2032316.htmlGoogleMapsAPI_OfflineDebugPack来自:https://www.cnblogs.com/Tangf/archive/2009/02/20/1394511.html两个Api下载链接:https://pan.baidu.com/s/1SfRccuFHo1qsQyKK_LJBiA提取码:t64t从谷歌官方网站获取最

    2022年9月20日
    0
  • 对于RFID-RC522 模块的读写操作【Arduino】[通俗易懂]

    对于RFID-RC522 模块的读写操作【Arduino】[通俗易懂]玩儿板子–用Arduino链接RFID-RC522型号的Rfid模块。并且用放出实例代码目前百度基本上搜不到RC522板子的具体操作代码,基本上贴出来的只有接线,所以这次直接放出读写操作的代码算是做贡献吧。这个是板子建议:把送的两个插头,焊上去是最好的接线:

    2022年9月19日
    0
  • 什么是手机软件测试工程师_软件测试

    什么是手机软件测试工程师_软件测试手机测试是一个很大的题目,涉及到硬件测试和软件测试,还有结构的测试,比如抗压,抗摔,抗疲劳,抗低温高温等,结构上的设计不合理,会造成应力集中,使得本身外壳变形,对于翻盖手机,盖子失效,还有其他严重问题。硬件测试一般都有严格的物理电气指标,也有专门的仪器,这里的仪器,不在多说,一般如果是专业的测试人员,不会对此陌生吧。  手机测试,一般是指软件测试,这个一方面也说明了软件在手机上的重要性。一方面也说

    2022年9月6日
    2
  • 用Python打击盗号钓鱼网站

    用Python打击盗号钓鱼网站事情还要从我在吾爱看到的一个网址说起,放地址:http://tencent.outlook.com.eskdp.xyz/mail/打开之后是一个模仿QQ空间登陆的页面,然后你在账号密码框里输入任何东西,它都会跳转到QQ邮箱的页面(这里的QQ邮箱确实是腾讯旗下的QQ邮箱),这样会给很多小白造成错觉:嗯,一定是QQ家族出现了问题,我登陆QQ空间竟然给我跳到QQ邮箱了。我们来抓下包,在这个页面打开开发者工具(右键-检查),打开Network,因为后面会有跳转,所以勾选上Preservelog,然后随便输入

    2022年7月26日
    5
  • savefiledialog用法python_openfiledialog选择文件夹

    savefiledialog用法python_openfiledialog选择文件夹publicTestOne(){InitializeComponent();SaveFileDialog();//调用打开保存对话框}#region保存对话框privatevoidSaveFileDialog(){//stringlocalFilePath,fileNameExt,newFileName

    2022年10月8日
    0

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号