html学习笔记

标签

a标签

a 标签是 HTML 中的超链接元素，用于创建指向其他网页、文件、位置或同一页面内不同部分的链接

<a href="网站地址">访问示例网站</a>

• a标签锚点属性：使用 a 标签可以创建锚点链接，使得点击后能够跳转到同一页面的特定位置。
• 这种用法常用于长页面中的目录、返回顶部等场景。

<!-- 使用 name 属性定义锚点 -->
<a name="anchor1"></a>
<!-- 或者使用 id 属性定义锚点 -->
<div id="anchor2"></div>
<!-- 链接到使用 name 属性定义的锚点 -->
<a href="#anchor1">跳转到锚点1</a>
<!-- 链接到使用 id 属性定义的锚点 -->
<a href="#anchor2">跳转到锚点2</a>

input标签

input 标签是 HTML 中用于创建交互式表单控件的基本元素。它允许用户输入数据，这些数据可以提交给服务器进行处理。
根据不同的 type 属性值，input 标签可以呈现为多种形式的控件，如文本框、密码框、单选按钮、复选框、按钮等。

<input type="类型" name="名称" value="值" 其他属性>

• *常用属性：：

• type：

• 指定输入控件的类型。常见的类型包括：

  • text：单行文本输入框。
  • password：密码输入框，输入内容会被隐藏。
  • checkbox：复选框，用于多选。
  • radio：单选按钮，用于单选。
  • submit：提交按钮，用于提交表单数据。
  • reset：重置按钮，用于重置表单数据。
  • button：普通按钮，通常与 JavaScript 一起使用。
  • file：文件选择框，用于上传文件。
  • email、url、number、date 等：特定格式的输入框。

• name：

• 指定输入控件的名称，用于在表单提交时识别数据。

• value：

• 指定输入控件的初始值或默认值。

• placeholder：

  • 为文本输入框提供占位符文本，提示用户输入内容。

• required：

  • 指定输入控件为必填项。

• disabled：

  • 禁用输入控件，使其不可用。

• checked：

  • 对于单选按钮或复选框，指定其默认选中状态。

• maxlength：

  • 指定文本输入框的最大字符数。

• min、max、step：

  • 用于数值输入框，指定最小值、最大值和步长。

img标签

img 标签是 HTML 中用于嵌入图像的元素。
它允许你将图像文件插入到网页中，从而丰富页面内容，提升视觉效果。

<img src="图像的URL" alt="替代文本" 其他属性>

以下是将您提供的文本按照 Markdown 格式整理后的源码：

• onerror：

  • 该属性可以用来在图片加载失败时执行 JavaScript 代码。

• src：

  • 必需属性，指定图像的URL。可以是相对路径或绝对路径。

• alt：

  • 替代文本，用于在图像无法加载时显示，或为屏幕阅读器提供图像描述。

• width：

  • 设置图像的宽度，单位为像素或百分比。

• height：

  • 设置图像的高度，单位为像素或百分比。

• title：

  • 为图像添加额外信息，通常在鼠标悬停时显示为工具提示。

• style：

  • 用于直接为图像设置内联CSS样式。

• class：

  • 为图像添加类名，以便通过CSS进行样式设置。

• id：

  • 为图像设置唯一标识符。

• srcset：

  • 用于响应式设计，根据设备屏幕大小和分辨率提供不同大小的图像。

• sizes：

  • 与srcset属性配合使用，定义图像在不同条件下的显示大小。
    在 Markdown 中，使用 - 表示无序列表的项，** 用于强调文本（例如属性名）。这种格式简洁且易于阅读，适用于文档和说明文件的编写。

script标签

• 执行javascript代码

<script>javascript代码;</script>

• 引入js文件

<script type="text/javascript" src="js文件路径"></scrtipt>

style标签

• 用于在html文件中书写css代码

<style>
    css代码
</style>

link标签

• 引入css文件

<link rel="stylesheet" href="css文件路径">

label标签

label标签是HTML中的一个元素，用于定义输入字段（如文本框、密码框、单选按钮、复选框等）的标题或说明。
它通常与表单元素一起使用，以提供用户输入的额外信息或说明。

<label for="inputElementId">标签文本</label>
<input type="text" id="inputElementId" />

属性

onclick属性

onclick 属性是 HTML 中用于指定当用户点击某个元素时应该执行什么 JavaScript 代码或函数的一个事件属性。这个属性可以用于几乎所有的 HTML 元素，但最常用于按钮、链接和表单元素。

例：<input type="submit" value="登录" onclick="alert('我的博客不是猫')">

这个属性很有趣，当将网页的标签添加onclick=“alert(‘文本’)”属性时，点击该标签会跳出警告框。
这个可用来打某些xss的靶场（自欺欺人的打法）

type属性

当type=”hidden”时 input字段不会显示在网页上

例：<input type="hidden" id="userId" name="userId" value="12345">

onerror属性

img标签的onerror 属性可以用来在图片加载失败时执行 JavaScript 代码。

例：<img src="错误文件路劲" onload="alert("我的博客不是猫")">