您现在的位置是：网站首页 > HTML常见错误及代码示例文章详情
HTML常见错误及代码示例
陈川
【
HTML
】
22483人已围观
HTML是构建网页的基础，但即使是经验丰富的开发者也可能会犯一些常见的错误。以下是一系列在编写HTML时需要注意的常见错误，包括但不限于标签使用、属性定义、结构逻辑等方面。
1. 标签使用错误
1.1 未闭合标签
错误示例:
<p>This is a paragraph正确示例:
<p>This is a paragraph.</p>1.2 错误的嵌套
错误示例:
<ul>
<li>Item 1</li>
<li>Item 2
<li>Item 3</li>
</ul>正确示例:
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>1.3 错误的自闭合标签
错误示例:
<img src="image.jpg" alt="An image">正确示例:
<img src="image.jpg" alt="An image" />2. 属性定义错误
2.1 漏掉引号
错误示例:
<a href=http://example.com>Link</a>正确示例:
<a href="http://example.com">Link</a>2.2 错误的属性值
错误示例:
<input type="text" maxlength="100" size="20" value="10">正确示例:
<input type="number" max="100" min="0" value="10">3. 结构逻辑错误
3.1 不合理的标签使用
错误示例:
<div>This should be a heading</div>正确示例:
<h1>This should be a heading</h1>3.2 无序列表作为有序列表使用
错误示例:
<ul>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ul>正确示例:
<ol>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ol>4. 可访问性错误
4.1 缺少替代文本
错误示例:
<img src="image.jpg">正确示例:
<img src="image.jpg" alt="A description of the image">4.2 忽略ARIA角色
错误示例:
<button>Click me</button>正确示例:
<button role="button">Click me</button>5. SEO和元数据错误
5.1 忽略<title>标签
错误示例:
<head>
<!-- Missing title -->
</head>正确示例:
<head>
<title>Page Title</title>
</head>5.2 忽略<meta>描述
错误示例:
<head>
<!-- Missing meta description -->
</head>正确示例:
<head>
<meta name="description" content="A brief description of the page content.">
</head>6. 其他错误
6.1 错误的DOCTYPE声明
错误示例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">正确示例:
<!DOCTYPE html>
站点信息
- 建站时间：2017-10-06
- 网站程序：Koa+Vue
- 本站运行：
- 文章数量：
- 总访问量：
- 微信公众号：扫描二维码，关注我
