HTML——链接标记

1、链接标记的锚功能
这里主要就是<a></a> 标签,用于定位,常和href并用。
举例:点击链接分别链接到头部和中间位置;

<a name ="_abc"></a>
    <a href="#_abc">回到顶部</a>&nbsp;<a href="#_cde">回到中间</a>
#代表当前页
<html>
<head>
    <title>图形标记</title>

    <meta http-equiv="Content-Type" content ="text/html; charset=utf-8">
</head>
<body>
    <!--A标签的锚点功能 -->
    <a name ="_abc"></a>
    <img src = "html.jpeg" border="1" width="300" height="300" alt = "哈哈" title="嘿嘿"/><br/>
    <img src = "html.jpeg" border="1" width="300" height="300" alt = "哈哈" title="嘿嘿"/><br/>
    <img src = "html.jpeg" border="1" width="300" height="300" alt = "哈哈" title="嘿嘿"/><br/>
    <img src = "html.jpeg" border="1" width="300" height="300" alt = "哈哈" title="嘿嘿"/><br/>
    <a name="_cde"></a>
    <img src = "html.jpeg" border="1" width="300" height="300" alt = "哈哈" title="嘿嘿"/><br/>
    <img src = "html.jpeg" border="1" width="300" height="300" alt = "哈哈" title="嘿嘿"/><br/>
    <img src = "html.jpeg" border="1" width="300" height="300" alt = "哈哈" title="嘿嘿"/><br/>
    <a href="#_abc">回到顶部</a>&nbsp;<a href="#_cde">回到中间</a>

</body>
</html>

2、链接标记的另类表现

target="_blank
当点击链接以后会再开一个页面。
<html>
<head>
    <title>图形标记</title>
    <meta http-equiv="Content-Type" content ="text/html; charset=utf-8">
</head>
<body>
    <a href = "02-排版标记.html" target="_blank">点我</a><br/>
    <a href="http://www.baidu.com" target="_blank">百度</a><br/>
    <a href="mailto:jungle1992@163.com" target="_blank">邮箱</a><br/>
    <a href="thunder://E#433" target="_blank">迅雷下载</a><br/>

</body>
</html>
### HTML基础教程 HTML(Hyper Text Markup Language,超文本标记语言)是一种用于创建网页的标准标记语言。以下将详细介绍HTML的基础知识、基本结构和常用标签。 #### 1. HTML的基本结构 一个标准的HTML文档由`<html>`标签包裹,分为头部(`<head>`)和主体(`<body>`)。以下是HTML文档的基本结构[^1]: ```html <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>网页标题</title> </head> <body> <h1>欢迎学习HTML</h1> <p>这是一个段落。</p> </body> </html> ``` #### 2. 常用HTML标签 HTML通过标签来定义网页的内容和结构。以下是一些常用的HTML标签及其功能: - **标题标签**:`<h1>`到`<h6>`,表示不同级别的标题。 - **段落标签**:`<p>`,用于定义段落。 - **链接标签**:`<a>`,用于创建超链接。 ```html <a href="https://www.example.com">访问示例网站</a> ``` - **图片标签**:`<img>`,用于插入图片。 ```html <img src="image.jpg" alt="描述性文字"> ``` - **列表标签**:`<ul>`(无序列表)、`<ol>`(有序列表)和`<li>`(列表项)。 ```html <ul> <li>项目一</li> <li>项目二</li> </ul> ``` - **表格标签**:`<table>`、`<tr>`(行)、`<td>`(单元格)。 ```html <table border="1"> <tr> <td>单元格1</td> <td>单元格2</td> </tr> </table> ``` #### 3. 属性的使用 HTML标签可以通过属性来扩展功能。例如,`<img>`标签的`src`属性指定图片路径,`alt`属性提供替代文字。 #### 4. 注释的使用 在HTML中,可以使用注释来标记代码或暂时禁用某些部分。注释的语法为`<!-- 内容 -->`。 ```html <!-- 这是一个HTML注释 --> <p>此段落可见于浏览器。</p> ``` #### 5. 实践建议 学习HTML时,建议从简单的页面开始练习,逐步掌握标签的使用方法和属性设置。同时,可以结合CSS进行样式设计,提升页面美观度。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值