HTML 链接语法
2025-04-23
18
参考资料
HTML 链接语法
基本语法
<a href="URL">链接文本</a>
主要属性
href
: 指定链接目标URLtarget
: 控制打开方式_self
: 当前窗口(默认)_blank
: 新窗口_parent
: 父框架_top
: 顶层窗口rel
: 定义链接与当前文档的关系nofollow
: 告诉搜索引擎不要追踪noopener
: 防止新窗口访问原窗口noreferrer
: 隐藏来源信息download
: 提示下载目标资源title
: 鼠标悬停时显示的提示文本
常见用法
普通链接
<a href="https://example.com">访问示例网站</a>
邮件链接
<a href="mailto:contact@example.com">联系我们</a>
电话链接
<a href="tel:+1234567890">拨打电话</a>
锚点链接
<a href="#section2">跳转到第二节</a> ... <h2 id="section2">第二节</h2>
CSS扩展样式
/* 基础样式 */ a { color: #0066cc; text-decoration: none; } /* 悬停效果 */ a:hover { color: #004499; text-decoration: underline; } /* 已访问链接 */ a:visited { color: #660099; } /* 活动链接(点击时) */ a:active { color: #ff0000; } /* 按钮样式链接 */ a.button { display: inline-block; padding: 10px 20px; background-color: #0066cc; color: white; border-radius: 5px; transition: background-color 0.3s; } a.button:hover { background-color: #004499; }
高级功能
下载文件
<a href="/files/document.pdf" download>下载PDF</a>
打开特定应用
<a href="whatsapp://send?text=Hello">WhatsApp分享</a>
社交媒体分享
<a href="https://twitter.com/share?url=YOUR_URL">分享到Twitter</a>
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。