HTML日常学习笔记

105 阅读2分钟

  1. <html>:文档的根元素。

  2. <body>:包含文档的所有内容。

  3. <main>:主内容区域。

  4. <h1><h3>:标题标签。

  5. <section>:定义文档中的节。

  6. <p>:段落。

  7. <a>:超链接。

  8. <img>:图像。

  9. <ul>:无序列表。

  10. <li>:列表项。

  11. <figure>:包含图像和标题的组合。

  12. <figcaption>:为figure元素定义标题。

  13. <ol>:有序列表。

  14. <em>:强调文本(斜体)。

  15. <strong>:强调文本(粗体)。

  16. <form>:表单。

  17. 还有属性如target="_blank"hrefsrcaltaction等。

接下来,我将逐个整理并且解释这些标签的用法。需要注意的是,我们应该对某些标签的具体属性多加记忆,比如<a>标签的target属性,或者<img>的alt属性作用。

比如,<a>标签用于创建链接,href属性指定目标URL,target="_blank"让链接在新标签页打开。而<img>标签的src属性是图片路径,alt属性提供替代文本,这对可访问性很重要。

在列表部分,我们用了无序列表<ul>和有序列表<ol>,每个列表项用<li>。需要说明两者的区别,以及何时使用有序或无序列表。

<figure><figcaption>的组合可能不太熟悉,需要我们特别注意它们的关系,通常用于将图片与其标题关联起来,增强语义化。

文本格式化标签<em><strong>要说明它们不仅是样式上的斜体和粗体,还带有语义上的强调,这对SEO和屏幕阅读器有帮助。

表单<form>有一个action属性,但内部还没有内容,需要注意的是还有常见的表单元素如输入框、提交按钮等。

在总结时,每个标签的用法我们要清晰,并通过给出对应的例子来理解,对学习的代码中的位置要熟稔于心。比如,代码中的<figure>包裹了图片和figcaption,这就是一个例子。

另外,需要检查是否有遗漏的标签,比如<main><section>这些HTML5的语义化标签,我们可能也需要了解它们的用途,即划分页面结构,提升可访问性和SEO。