您好,登录后才能下订单哦!
密码登录
登录注册
点击 登录注册 即表示同意《亿速云用户服务条款》
# HTML的基本标签是什么
HTML(HyperText Markup Language)是构建网页的基础语言,通过标签(tags)定义网页结构和内容。本文将详细介绍HTML中最核心的基本标签及其用法。
## 一、HTML文档结构标签
### 1. `<!DOCTYPE>`
```html
<!DOCTYPE html>
<!DOCTYPE html>
<html>
<html lang="zh-CN">
</html>
lang
属性指定文档语言(中文设为zh-CN
)<head>
<head>
<meta charset="UTF-8">
<title>页面标题</title>
</head>
<meta charset="UTF-8">
定义字符编码<title>
定义浏览器标签页标题<link>
引入外部资源(如CSS)<style>
内嵌CSS样式<script>
定义JavaScript代码<body>
<body>
网页可见内容区域
</body>
<h1>主标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<!-- 共6级 h1-h6 -->
h1
重要性最高,一个页面建议只有一个h1
<p>这是一个段落。</p>
<p>另一个段落<br>强制换行</p>
<p>
定义段落(自动添加上下边距)<br>
强制换行(空标签,无闭合标签)<strong>加粗文本(语义重要)</strong>
<b>视觉加粗</b>
<em>强调文本(斜体)</em>
<i>视觉斜体</i>
<u>下划线</u>
<s>删除线</s>
<sup>上标</sup>
<sub>下标</sub>
<img src="image.jpg" alt="图片描述" width="200">
src
图片路径alt
替代文本(SEO重要)width
/height
/title
等<audio controls>
<source src="audio.mp3" type="audio/mpeg">
浏览器不支持音频
</audio>
<video width="320" controls>
<source src="video.mp4" type="video/mp4">
</video>
controls
显示播放控件<source>
实现格式兼容<a href="https://example.com" target="_blank">外部链接</a>
<a href="#section2">页面锚点</a>
href
指定目标URLtarget="_blank"
在新窗口打开id
使用:
<h2 id="section2">第二节</h2>
<a href="mailto:contact@example.com">发送邮件</a>
<a href="tel:+123456789">拨打电话</a>
<ul>
<li>项目1</li>
<li>项目2</li>
</ul>
<ol type="A">
<li>第一项</li>
<li>第二项</li>
</ol>
type
可设为:1/A/a/I/i<dl>
<dt>术语</dt>
<dd>解释说明</dd>
</dl>
<table border="1">
<caption>表格标题</caption>
<tr>
<th>表头1</th>
<th>表头2</th>
</tr>
<tr>
<td>数据1</td>
<td>数据2</td>
</tr>
</table>
<table>
定义表格<tr>
表格行<td>
表格数据单元格<th>
表头单元格(自动加粗居中)<caption>
表格标题<thead>
/<tbody>
/<tfoot>
分组<form action="/submit" method="POST">
<!-- 表单控件 -->
</form>
action
指定提交地址method
提交方式(GET/POST)<input type="text" placeholder="用户名">
<input type="password">
<input type="email" required>
<input type="number" min="1" max="10">
<input type="date">
<input type="checkbox" id="agree">
<input type="radio" name="gender" value="male">
<input type="file" accept=".jpg,.png">
<input type="submit" value="提交">
type
值:text/password/email/checkbox/radio/file/submit等name
提交时的参数名required
必填项placeholder
提示文本<select>
<option value="1">选项1</option>
<option selected>选项2</option>
</select>
<textarea rows="4" cols="50"></textarea>
<label for="username">用户名:</label>
<input id="username" type="text">
<header>页眉</header>
<nav>导航栏</nav>
<main>主要内容</main>
<section>文档章节</section>
<article>独立内容(如博客文章)</article>
<aside>侧边栏</aside>
<footer>页脚</footer>
<figure>
<img src="chart.png">
<figcaption>图表说明</figcaption>
</figure>
<time datetime="2023-10-01">10月1日</time>
<div>
的通用容器<div>块级通用容器</div>
<span>行内通用容器</span>
<!-- 这是注释内容 -->
< <!-- < -->
> <!-- > -->
<!-- 空格 -->
© <!-- © -->
<article>
而非<div>
)<img>
无需写</img>
<title>
/<meta>
/<h1>
等标签通过掌握这些基本HTML标签,您已经能够构建结构完整的网页。随着Web技术的发展,建议进一步学习HTML5的新特性和语义化标签的应用实践。 “`
注:本文实际约1800字,通过调整示例数量和说明细节可轻松达到1900字。如需扩展,可以: 1. 增加每个标签的浏览器兼容性说明 2. 添加更多实际应用场景示例 3. 补充HTML5与HTML4的对比内容 4. 增加常见错误用法案例分析
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。