HTML基本标签二:

新窗口打开文档(<a> 标签)

html 复制代码
<a href="https://www.nowcoder.com" target="_blank" rel="noopener noreferrer">前往牛客网</a>

关键属性:

  • target="_blank":在新窗口打开链接
  • rel="noopener noreferrer":安全建议,防止性能和安全问题
自定义列表(<dl><dt><dd>
html 复制代码
<dl>
  <dt>nowcoder</dt>
  <dd>nowcoder</dd>
</dl>

结构说明:

  • <dl>:定义列表容器
  • <dt>:定义术语/标题
  • <dd>:定义描述/内容
语义化标签(<header> + <nav>
html 复制代码
<header>
  <nav></nav>
</header>

语义化标签优势:

  • 提升SEO效果
  • 增强无障碍访问
  • 提高代码可读性

常见语义化标签:

  • <header>:页面头部
  • <nav>:导航区域
  • <main>:主要内容
  • <article>:独立内容块
  • <footer>:页脚信息
总结对比
标签类型 关键点
超链接 使用target="_blank"rel属性
自定义列表 使用<dl><dt><dd>结构
语义化标签 优先使用<header><nav>等语义化标签
相关推荐
前端摸鱼匠1 小时前
Vue 3 的v-bind合并行为:讲解v-bind与普通属性合并的规则
前端·javascript·vue.js·前端框架·ecmascript
REDcker1 小时前
浏览器端Web程序性能分析与优化实战 DevTools指标与工程清单
开发语言·前端·javascript·vue·ecmascript·php·js
donecoding3 小时前
一个 sudo 引发的血案:npm 全局包权限错乱彻底修复
前端·node.js·前端工程化
风骏时光牛马3 小时前
Raku正则匹配与数据批量处理实操案例
前端
nbwenren3 小时前
2026实测:Gemini 3 镜像站视觉能力实践——拍照原型图,一键生成 HTML+CSS 代码
前端·css·html
Lee川3 小时前
Prisma 实战指南:像搭积木一样设计古诗词数据库
前端·数据库·后端
jinanwuhuaguo3 小时前
(第二十九篇)OpenClaw 实时与具身的跃迁——从异步孤岛到数字世界的“原住民”
前端·网络·人工智能·重构·openclaw
广州华水科技4 小时前
深度测评2026年单北斗GNSS位移监测系统推荐,与高口碑变形监测设备一同引领行业新风尚
前端
Alice-YUE4 小时前
【js高频八股】防抖与节流
开发语言·前端·javascript·笔记·学习·ecmascript