HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记（四）

HTML中列表的作用

HTML中的列表（List）用于呈现按照一定逻辑关系组织的信息，以便用户更好地理解和识别。列表可以分为有序列表、无序列表和定义列表三种类型。

  • 有序列表（Ordered List）：用于表示按照一定顺序排列的项目，每个项目都有对应的标记。常见的例子包括步骤、流程等。

  • 无序列表（Unordered List）：用于表示没有特定顺序的项目列表，每个项目的标记通常是默认的实心圆点符号。常见的例子包括特征、优点、缺点等。

  • 定义列表（Definition List）：用于表示一组术语及其对应的定义或描述，每个术语和对应的定义通常使用<dt>和<dd>标签进行标记。常见的例子包括词汇表、术语集合等。

使用列表可以帮助用户更好地理清思路，易于阅读和理解内容。此外，列表还可以通过CSS样式进行美化，增加页面的吸引力和整体性。

HTML中列表的作用是为了更好地组织和呈现信息，使得页面更加清晰易懂。常见的列表类型有无序列表（ul）、有序列表（ol）和定义列表（dl）。

无序列表可以用来列出不需要按照特定顺序排序的项目，每个项目通常前面会有一个小圆点或小方块来标记。

有序列表可以用来列出需要按照一定顺序排序的项目，每个项目通常前面会有一个数字或字母来标记。

定义列表则可以用来列出具有特定定义关系的术语及其对应的定义，在每个术语前面通常会有一个加粗的词条，而对应的定义则紧随其后。

使用HTML中的列表可以让我们更好地呈现和组织信息，并且可以增强页面的可读性和易用性。

除了更好地组织和呈现信息外，HTML中的列表还具有以下作用：

  1. 增加结构性：列表可以帮助页面内容的结构更加明确，使其更易于理解和导航。通过使用列表，可以将相关的信息分组，使页面结构更清晰。

  2. 提高可访问性：对于一些使用辅助功能的用户来说，列表可以提供更好的可访问性。屏幕阅读器和其他辅助技术可以识别列表，并根据其语义意义提供更准确的信息。

  3. 改善搜索引擎优化（SEO）：使用正确的列表结构可以提高搜索引擎对网页内容的理解和索引。搜索引擎爬虫可以更好地识别和解析列表，并理解列表项之间的关联性。

  4. 方便样式定制：通过CSS样式可以自定义列表的外观，包括调整标记符号的样式、项目之间的间距等。这样可以使列表在视觉上与页面的整体风格相匹配。

  5. 增加交互性：可以为列表项添加链接、按钮或其他交互元素，使用户能够点击列表项进行操作或导航到其他页面。

HTML中的列表不仅可以帮助组织和展示信息，还可以提高可访问性、优化SEO、自定义样式和增加交互性，从而改善网页的用户体验。

介绍html中的有序列表

在HTML中，有序列表（Ordered List）用于表示按照一定的顺序排列的项目。有序列表使用<ol>标签来定义，每个列表项使用<li>标签来定义。

下面是一个示例：

<ol><li>第一项</li><li>第二项</li><li>第三项</li>
</ol>

渲染出来的效果如下：

  1. 第一项
  2. 第二项
  3. 第三项

可以看到，有序列表会自动为每个项目分配一个数字作为项目的标记。

有序列表还支持一些属性，可以通过属性来进行额外的控制。以下是一些常用的属性：

  • type：用于指定项目标记的类型。常见的取值有：
    • 1：默认值，使用阿拉伯数字（1, 2, 3…）作为标记。
    • A：使用大写字母（A, B, C…）作为标记。
    • a：使用小写字母（a, b, c…）作为标记。
    • I：使用大写罗马数字（I, II, III…）作为标记。
    • i：使用小写罗马数字（i, ii, iii…）作为标记。

下面是一个使用type属性的示例：

<ol type="A"><li>第一项</li><li>第二项</li><li>第三项</li>
</ol>

渲染出来的效果如下：

A. 第一项
B. 第二项
C. 第三项

无序列表

在HTML中，无序列表（Unordered List）用于表示没有特定顺序的项目列表。无序列表使用<ul>标签来定义，每个列表项使用<li>标签来定义。

下面是一个示例：

<ul><li>第一项</li><li>第二项</li><li>第三项</li>
</ul>

渲染出来的效果如下：

  • 第一项
  • 第二项
  • 第三项

可以看到，无序列表的项目标记通常是默认的实心圆点符号。

无序列表同样支持一些属性，以下是一些常用的属性：

  • type：用于指定项目标记的类型。常见的取值有：
    • disc：默认值，使用实心圆点作为标记。
    • circle：使用空心圆圈作为标记。
    • square：使用实心正方形作为标记。

下面是一个使用type属性的示例：

<ul type="circle"><li>第一项</li><li>第二项</li><li>第三项</li>
</ul>

渲染出来的效果如下：

○ 第一项
○ 第二项
○ 第三项

定义列表

在HTML中，可以使用<dl>、<dt>和<dd>标签来定义列表（Definition List）。定义列表用于表示名词及其对应的定义或描述。

<dl>标签定义了一个列表，<dt>标签定义了每个名词，<dd>标签定义了每个名词对应的定义或描述。

下面是一个示例：

<dl><dt>HTML</dt><dd>超文本标记语言（HyperText Markup Language）的缩写，用于创建网页的标准标记语言。</dd><dt>CSS</dt><dd>层叠样式表（Cascading Style Sheets）的缩写，用于设置网页的样式和布局。</dd><dt>JavaScript</dt><dd>一种用于编写交互性网页和应用程序的脚本语言。</dd>
</dl>

渲染出来的效果如下：

HTML
超文本标记语言（HyperText Markup Language）的缩写，用于创建网页的标准标记语言。

CSS
层叠样式表（Cascading Style Sheets）的缩写，用于设置网页的样式和布局。

JavaScript
一种用于编写交互性网页和应用程序的脚本语言。

在定义列表中，<dt>表示名词，<dd>表示定义或描述。可以根据需要添加任意数量的名词和对应的定义。

子元素介绍

列表是一种常见的HTML元素，用于组织和显示项目或定义的集合。在HTML中，主要有三种类型的列表：无序列表 (<ul>)、有序列表 (<ol>) 和定义列表 (<dl>)。下面是它们各自的子元素介绍：

  1. 无序列表 (<ul>) 的子元素：

    • 无序列表项 (<li>)：无序列表中的每个项目都是一个无序列表项。它可以包含文本、图像、链接等其他HTML元素。每个无序列表项以默认的小圆点或其他样式进行标记，具体样式可以通过CSS进行自定义。

  2. 有序列表 (<ol>) 的子元素：

    • 有序列表项 (<li>)：有序列表中的每个项目都是一个有序列表项。和无序列表项类似，有序列表项可以包含各种HTML元素作为内容。每个有序列表项都有一个自动生成的顺序编号，如数字、字母或罗马数字等。

  3. 定义列表 (<dl>) 的子元素：

    • 定义标题 (<dt>)：定义列表中的每个术语或名称都需要使用定义标题来标识。通常位于定义列表的起始位置。
    • 定义描述 (<dd>)：定义列表中的每个术语或名称需要配合一个或多个定义描述来解释或描述其含义。定义描述紧跟在相应的定义标题后面。

这些子元素在不同类型的列表中扮演不同的角色，但它们都用于将内容组织成具有结构和可读性的列表形式。通过使用适当的列表类型和子元素，可以有效地呈现和传达信息。

html中的表格标签

在HTML中，可以使用以下标签创建和格式化表格：

  1. <table>：定义一个表格。
  2. <tr>：定义表格中的一行。
  3. <th>：定义表头单元格，通常位于表格的第一行。
  4. <td>：定义数据单元格，用来显示表格中的数据。
  5. <caption>：定义表格的标题。
  6. <thead>：定义表格的头部（包含表头）。
  7. <tbody>：定义表格的主体部分（包含数据行）。
  8. <tfoot>：定义表格的页脚部分（包含汇总行）。

下面是一个简单的表格示例：

<table><caption>学生成绩表</caption><thead><tr><th>姓名</th><th>科目</th><th>成绩</th></tr></thead><tbody><tr><td>张三</td><td>数学</td><td>90</td></tr><tr><td>李四</td><td>语文</td><td>85</td></tr></tbody>
</table>

以上代码会创建一个有两行三列的表格，表格包含了一个标题和表头部分，以及两行数据行。每个单元格都使用<td>或<th>标签进行定义。

除了上述基本的表格标签之外，HTML还提供了一些其他属性和标签来格式化表格。

  1. colspan和rowspan属性：用于跨列或跨行合并单元格。例如：
<tr><th rowspan="2">编号</th><th>姓名</th><td>张三</td>
</tr>
<tr><th>性别</th><td>男</td>
</tr>

以上代码会创建一个表格，其中第一列跨两行，第二行中第一列为"姓名"，第二列为"性别"。

  1. <colgroup>和<col>标签：用于定义表格的列。例如：
<table><colgroup><col style="background-color: #ccc;"><col></colgroup><tr><th>列1</th><th>列2</th></tr><tr><td>数据1</td><td>数据2</td></tr>
</table>

以上代码会创建一个带有两列的表格，第一列的背景色为灰色。

  1. 表格样式：可以使用CSS样式来进一步控制表格的样式，包括表格边框、宽度、对齐方式等，示例代码：
<style>table {border: 1px solid black;border-collapse: collapse;width: 100%;}th, td {border: 1px solid black;padding: 8px;text-align: left;}
</style>

以上代码定义了表格的边框样式、宽度等属性，以及单元格的内边距和文本对齐方式。

  1. 表格排列和对齐：可以通过使用<thead>、<tbody>和<tfoot>标签来将表格分成不同的部分，然后利用CSS样式来控制这些部分的样式。

例如，以下代码会将表格的表头行和数据行颜色分别设为蓝色和白色，并使表头行文本居中对齐：

<style>th {background-color: blue;color: white;text-align: center;}tbody tr {background-color: white;}
</style><table><thead><tr><th>编号</th><th>名称</th><th>价格</th></tr></thead><tbody><tr><td>1</td><td>商品1</td><td>100元</td></tr><tr><td>2</td><td>商品2</td><td>200元</td></tr></tbody>
</table>
  1. 响应式表格：可以使用CSS媒体查询来创建响应式表格，以适应不同屏幕大小的显示。例如，以下代码会在屏幕宽度小于600像素时，将表头单元格变为顺序列表示，而不是水平排列：
<style>table {border-collapse: collapse;width: 100%;}th, td {border: 1px solid black;padding: 8px;text-align: left;}@media only screen and (max-width: 600px) {th {display: block;}}
</style><table><thead><tr><th>编号</th><th>名称</th><th>价格</th></tr></thead><tbody><tr><td>1</td><td>商品1</td><td>100元</td></tr><tr><td>2</td><td>商品2</td><td>200元</td></tr></tbody>
</table>

以上代码会在屏幕宽度小于600像素时，将表头单元格以顺序列表示，而不是水平排列。

表格中的单元格如何合并

表格中的单元格可通过使用colspan和rowspan属性来合并单元格，具体方式如下：

  1. 合并列（colspan）：将一个单元格跨越多列的宽度，即占据多列。
<table><tr><th>姓名</th><td colspan="2">张三</td></tr><tr><th>年龄</th><td>20岁</td><td>男</td></tr>
</table>

以上代码会创建一个表格，其中第二行第一列为"姓名"，第二列和第三列合并成一格，显示"张三"。

  1. 合并行（rowspan）：将一个单元格跨越多行的高度，即占据多行。
<table><tr><th rowspan="2">1</th><th>2</th><td>a</td></tr><tr><th>3</th><td>b</td></tr><tr><th>4</th><td>c</td><td>d</td></tr>
</table>

以上代码会创建一个表格，其中第一列的第一行和第二行合并成一格，显示数字"1"。
当需要合并多行和多列时，可以同时使用colspan和rowspan来实现更复杂的单元格合并。

以下是一个示例，演示如何在表格中合并多行和多列的单元格：

<table><tr><th rowspan="2">产品</th><th colspan="2">销售额</th></tr><tr><th>第一季度</th><th>第二季度</th></tr><tr><td rowspan="3">A</td><td>100</td><td>200</td></tr><tr><td>150</td><td>250</td></tr><tr><td>120</td><td>180</td></tr>
</table>

以上代码会创建一个表格，其中有一个合并了两行和两列的单元格。第一列的"产品"单元格跨越了三行，而第一行的"销售额"单元格跨越了两列。

框架标签

框架标签（<frame>和<frameset>）已被废弃，不再建议在 HTML 中使用，因为它们与现代 Web 开发的语义化和可访问性准则不兼容。

相反，建议使用 <iframe> 元素作为替代方案。<iframe> 元素允许在一个页面中嵌入另一个页面，并且开发者可以自由地控制它的大小、位置和内容。

以下是一个简单的示例，演示如何在一个 HTML 页面中嵌入另一个页面：

<!DOCTYPE html>
<html><head><title>嵌入网页示例</title></head><body><h1>主页面</h1><p>这是一个主页面。</p><iframe src="http://www.example.com"></iframe></body>
</html>

以上代码会创建一个包含一个带有 src 属性的 <iframe> 元素的 HTML 文件。该属性指定要嵌入的另一个页面的 URL。在这种情况下，嵌入的页面将是 “http://www.example.com”。

如果你需要控制 <iframe> 元素的大小、位置和样式，可以使用 CSS 在样式表中对其进行配置。以下是一些基本的 CSS 属性，可以用来控制 <iframe> 元素：

  • width：设置元素的宽度。
  • height：设置元素的高度。
  • border：设置元素的边框。例如，border: 1px solid black; 表示一个黑色的、边框宽度为 1 像素的边框。
  • margin：设置元素的外边距。例如，margin: 10px; 表示一个 10 像素的外边距。
  • padding：设置元素的内边距。例如，padding: 10px; 表示一个 10 像素的内边距。

以下是一个示例，演示如何在样式表中对 <iframe> 元素进行配置：

<!DOCTYPE html>
<html><head><title>嵌入网页示例</title><style>iframe {width: 500px;height: 300px;margin: 20px;padding: 10px;border: 1px solid black;}</style></head><body><h1>主页面</h1><p>这是一个主页面。</p><iframe src="http://www.example.com"></iframe></body>
</html>

以上代码会创建一个包含一个带有样式的 <iframe> 元素的 HTML 文件。该元素将具有指定的宽度、高度、外边距、内边距和边框。

表单的语义化

表单的语义化是指使用合适的HTML元素和属性来描述表单的结构和目的，以便提供更好的可访问性、可维护性和语义明确性。通过正确使用语义化的表单标记，可以使页面更易于理解和操作。

以下是一些常见的用于表单语义化的HTML元素和属性：

  1. <form>：定义表单区域的开始和结束。
  2. <input>：用于输入文本、数字、日期等各种类型的数据。可以使用不同的type属性来指定输入类型，例如text、number、date等。
  3. <textarea>：用于多行文本输入。
  4. <select>：用于创建下拉选择框。
  5. <option>：定义<select>元素中的选项。
  6. <label>：与表单控件关联的标签，以提供更好的可访问性和用户体验。使用for属性将标签与相应的表单控件关联起来。
  7. <button>：用于创建按钮，可以用于提交表单或执行其他操作。
  8. <fieldset>和<legend>：用于将相关的表单元素分组，并为分组添加标题。

使用这些元素和属性，可以清晰地定义表单的结构和目的。通过正确的语义化，浏览器、辅助技术和搜索引擎可以更好地理解和处理表单，同时提供更好的用户体验。

以下是一个简单的示例，展示了如何语义化地创建一个登录表单：

<form><fieldset><legend>用户登录</legend><div><label for="username">用户名：</label><input type="text" id="username" name="username" required></div><div><label for="password">密码：</label><input type="password" id="password" name="password" required></div><div><button type="submit">登录</button></div></fieldset>
</form>

在以上示例中，<form>元素表示整个表单区域。<fieldset>和<legend>元素用于将表单元素分组，并为分组添加标题。<label>元素与各个输入字段关联，提供标签名称和for属性。<input>元素用于接受用户名和密码，<button>元素用于提交表单。

当涉及到表单的语义化时，除了使用合适的HTML元素和属性之外，还可以考虑以下几点：

  1. 使用<input>元素的type属性：根据输入字段所需的数据类型，选择正确的type属性。例如，使用type="email"来接受电子邮件地址，使用type="tel"来接受电话号码等。

  2. 使用<input>元素的autocomplete属性：为表单控件启用自动填充功能，使用户能够更方便地填写表单。例如，对于用户名字段，可以设置autocomplete="username"。

  3. 使用<input>元素的pattern属性：通过使用正则表达式模式，限制用户输入的格式。例如，可以使用pattern="[A-Za-z]{3}"来限制用户名为3个字母。

  4. 使用<input>元素的required属性：将required属性添加到必填字段上，以便在提交表单之前进行验证。这样可以确保用户不会忘记填写必要的信息。

  5. 使用<input>元素的placeholder属性：提供示例文本，帮助用户理解该字段所需的内容格式或类型。

  6. 使用<fieldset>和<legend>元素进行分组：如果表单包含多个相关字段，可以使用<fieldset>和<legend>元素将它们分组起来，并为分组添加一个标题，使其更易于理解和导航。

  7. 使用<datalist>元素提供选项：当用户需要从一组预定义选项中选择时，可以使用<datalist>元素提供一个下拉列表。用户可以从列表中选择或手动输入值。

  8. 使用aria-label和aria-labelledby属性：为表单控件添加适当的ARIA属性，以提高可访问性。aria-label用于提供简短的描述，而aria-labelledby用于引用包含描述的元素的ID。

通过合理地运用上述技术和建议，可以创建具有良好语义化的表单，增强用户体验、可访问性和可维护性。

当涉及到表单的语义化时，还可以考虑以下几点：

  1. 使用适当的标签：除了使用<input>、<select>和<textarea>等元素外，还可以考虑使用更具语义化的标签来表示不同类型的输入。例如，使用<input type="checkbox">来表示复选框，使用<input type="radio">来表示单选按钮。

  2. 使用<datalist>元素提供预定义选项：使用<datalist>元素可以为输入字段提供一组预定义选项。这样，浏览器将自动为用户提供自动完成功能，使其更轻松地选择合适的选项。

  3. 使用<output>元素显示计算结果或反馈信息：<output>元素可用于显示计算结果或向用户提供反馈信息，以增强用户体验。

  4. 使用<progress>元素显示进度条：当需要展示长时间操作的进度时，可以使用<progress>元素来显示进度条，帮助用户了解操作的完成情况。

  5. 使用<meter>元素表示度量值：<meter>元素用于表示某个度量值或比例。例如，可以使用<meter>元素来表示文件上传的进度或密码强度。

  6. 使用<fieldset>和<legend>元素分组相关字段：当表单包含多个相关字段时，可以使用<fieldset>和<legend>元素将它们分组起来，并为分组添加一个标题，以提高表单的可读性和易用性。

  7. 使用role属性增强可访问性：使用role属性可以将自定义角色分配给表单元素，以增强可访问性。例如，可以为表单的提交按钮添加role="button"来模拟按钮的行为。

通过考虑上述建议，可以更好地语义化表单，提供更好的用户体验、可访问性和可维护性。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/108560.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

GB/T 41510-2022 起重机械安全评估规范 通用要求 摘要

GB/T 41510-2022 起重机械安全评估规范 通用要求 摘要

在线预览|GB/T 41510-2022http://c.gb688.cn/bzgk/gb/showGb?typeonline&hcno696806EC48F4105CEF7479EB32C80C9E 知识点&#xff1a; 安全等级定义&#xff0c;设计寿命&#xff0c;剩余寿命&#xff0c;使用寿命。 标准附录有应力的具体解算演示。
阅读更多...
vue前端实现打印功能并约束纸张大小---调用浏览器打印功能打印页面部分元素并固定纸张大小

vue前端实现打印功能并约束纸张大小---调用浏览器打印功能打印页面部分元素并固定纸张大小

需求是打印指定div实现小票打印功能。调用浏览器的自带打印功能只能实现打印可视区域&#xff0c;所以这里采用截图新窗口打开打印去实现此需求。 1.安装html2canvas库实现截图功能 npm install html2canvas --save2.在需要进行截图和打印的组件中&#xff0c;引入html2canvas…
阅读更多...
VScode platformio的使用

VScode platformio的使用

一、platformio 工程创建 打开vscode界面你会发现左下多了个家的小图标&#xff0c;点击这里就可以进入platformio。 在右侧Quick Access栏中&#xff0c;有4个选项。可以看得出来&#xff0c;我们这里直接点击创建一个新的工程。 点击New Project打开project配置界面&#x…
阅读更多...
LoongArch单机Ceph Bcache加速4K随机写性能测试

LoongArch单机Ceph Bcache加速4K随机写性能测试

LoongArch单机Ceph Bcache加速4K随机写性能测试 两块HDD做OSD [rootceph01 ~]# fio -direct1 -iodepth128 -thread -rwrandwrite -ioenginelibaio -bs4k -size100G -numjobs1 -runtime600 -group_reporting -namemytest -filename/dev/rbd0 mytest: (g0): rwrandwrite, bs(R)…
阅读更多...
C++对象模型（14）-- 构造函数语义学：拷贝构造函数和赋值运算赋

C++对象模型（14）-- 构造函数语义学：拷贝构造函数和赋值运算赋

1、拷贝构造函数 1.1 什么是拷贝构造函数 拷贝构造函数是一种构造函数&#xff0c;它的功能是创建新对象。也就是说对象还没生成&#xff0c;这时利用另一个对象的拷贝来生成新的对象。 class MyDemo { public:// 默认构造函数MyDemo(){}// 拷贝构造函数MyDemo(const MyDemo…
阅读更多...
【微信小程序】6天精准入门（第2天：小程序的视图层、逻辑层、事件系统及页面生命周期）

【微信小程序】6天精准入门（第2天：小程序的视图层、逻辑层、事件系统及页面生命周期）

一、视图层 View 1、什么是视图层 框架的视图层由 WXML 与 WXSS 编写&#xff0c;由组件来进行展示。将逻辑层的数据反映成视图&#xff0c;同时将视图层的事件发送给逻辑层。WXML(WeiXin Markup language) 用于描述页面的结构。WXS(WeiXin Script) 是小程序的一套脚本语言&am…
阅读更多...
实验四：回溯算法的设计与分析

实验四：回溯算法的设计与分析

某不知名学校大二算法课实验报告 题目来自力扣 第一题&#xff1a;幂集 力扣题目链接&#xff1a;幂集 题目描述&#xff1a; 幂集。编写一种方法&#xff0c;返回某集合的所有子集。集合中不包含重复的元素。 说明&#xff1a;解集不能包含重复的子集。 示例: 输入&#xf…
阅读更多...
【C++ Primer Plus学习记录】指针——指针和字符串

【C++ Primer Plus学习记录】指针——指针和字符串

数组和指针的特殊关系可以扩展到C-风格字符串。请看下面的代码&#xff1a; char flower[10] "rose"; cout << flower << "s are red\n"; 数组名是第一个元素的地址&#xff0c;因此cout语句中的flower是包含字符r的char元素的地址。cout对…
阅读更多...
Leetcode刷题详解——长度最小的子数组

Leetcode刷题详解——长度最小的子数组

1. 题目链接&#xff1a;209. 长度最小的子数组 2. 题目描述&#xff1a; 给定一个含有 n 个正整数的数组和一个正整数 target 。 找出该数组中满足其总和大于等于 target 的长度最小的 连续子数组 [numsl, numsl1, ..., numsr-1, numsr] &#xff0c;并返回其长度**。**如果不…
阅读更多...
Tang Capital宣布收购纳斯达克上市公司Rain Oncology100%股权

Tang Capital宣布收购纳斯达克上市公司Rain Oncology100%股权

来源&#xff1a;猛兽财经 作者&#xff1a;猛兽财经 猛兽财经获悉&#xff0c;纳斯达克上市公司Rain Oncology(Rain)宣布近期已收到Tang Capital Partners旗下的子公司Concentra Biosciences以每股1.25美元的现金收购要约。 这家临床阶段微型市值癌症治疗药物开发商的股价在消…
阅读更多...
Java第三方登录封装工具类

Java第三方登录封装工具类

Java中可以使用第三方登录来简化用户登录流程&#xff0c;常见的第三方登录如QQ、微信、微博等。下面是一个Java封装第三方登录的工具类&#xff1a; import java.io.IOException; import java.util.HashMap; import java.util.Map;import org.apache.http.client.ClientProto…
阅读更多...
apache shiro安全框架反序列化漏洞

apache shiro安全框架反序列化漏洞

shiro是开源安全框架&#xff0c;它干净利落地处理身份认证&#xff0c;授权&#xff0c;企业会话管理和加密。 参见文章&#xff1a;百度安全验证 用linux搭建一个环境 配置下源vi /etc/apt/sources.list 源如果是kali官方的有时候会下载不了&#xff0c;改成中科大的源 更…
阅读更多...
【Proteus仿真】【51单片机】电蒸锅温度控制系统

【Proteus仿真】【51单片机】电蒸锅温度控制系统

文章目录 一、功能简介二、软件设计三、实验现象联系作者 一、功能简介 本项目使用Proteus8仿真51单片机控制器&#xff0c;使用LCD1602液晶、按键开关、蜂鸣器、DS18B20温度传感器&#xff0c;液位传感器、继电器控制加热保温装置等。 主要功能&#xff1a; 系统运行后&#…
阅读更多...
英国人工智能公司【TitanML】完成280万美元融资

英国人工智能公司【TitanML】完成280万美元融资

来源&#xff1a;猛兽财经 作者&#xff1a;猛兽财经 猛兽财经获悉&#xff0c;总部位于英国伦敦的人工智能公司【TitanML】近期宣布已完成280万美元种子轮融资&#xff0c;该公司的产品允许机器学习团队部署大型语言模型(llm)。 本轮融资由Octopus Ventures领投&#xff0c;还…
阅读更多...
Python文件共享+cpolar内网穿透：轻松实现公网访问

Python文件共享+cpolar内网穿透：轻松实现公网访问

文章目录 1.前言2.本地文件服务器搭建2.1.Python的安装和设置2.2.cpolar的安装和注册 3.本地文件服务器的发布3.1.Cpolar云端设置3.2.Cpolar本地设置 4.公网访问测试5.结语 1.前言 数据共享作为和连接作为互联网的基础应用&#xff0c;不仅在商业和办公场景有广泛的应用&#…
阅读更多...
【LeetCode】5. 最长回文子串

【LeetCode】5. 最长回文子串

1 问题 给你一个字符串 s&#xff0c;找到 s 中最长的回文子串。 如果字符串的反序与原始字符串相同&#xff0c;则该字符串称为回文字符串。 示例 1&#xff1a; 输入&#xff1a;s “babad” 输出&#xff1a;“bab” 解释&#xff1a;“aba” 同样是符合题意的答案。 示…
阅读更多...
【Codeforces】Codeforces Round 903 (Div. 3)【待补】

【Codeforces】Codeforces Round 903 (Div. 3)【待补】

Dashboard - Codeforces Round 903 (Div. 3) - Codeforces Problem - C - Codeforces Problem - D - Codeforces
阅读更多...
进程的虚拟地址空间

进程的虚拟地址空间

一、 对于C/C程序员&#xff0c;我们看到的程序中的地址&#xff0c;都不是物理地址&#xff0c;而是操作系统映射的虚拟地址/线性地址&#xff0c;每一个进程都映射了同样结构的虚拟地址空间&#xff0c;让进程以为自己在独享内存资源&#xff0c;下图是以Linux下32位操作系统…
阅读更多...
spark stream入门案例：netcat准实时处理wordCount（scala 编程）

spark stream入门案例：netcat准实时处理wordCount（scala 编程）

目录 案例需求 代码 结果 解析 案例需求&#xff1a; 使用netcat工具向9999端口不断的发送数据&#xff0c;通过SparkStreaming读取端口数据并统计不同单词出现的次数 -- 1. Spark从socket中获取数据&#xff1a;一行一行的获取 -- 2. Driver程序执行时&#xff0c…
阅读更多...
Lock使用及效率分析(C#)

Lock使用及效率分析(C#)

针对无Lock、Lock、ReadWriterLock、ReadWriterLockSlim四种方式&#xff0c;测试在连续写的情况下&#xff0c;读取的效率&#xff08;原子操作Interlocked由于使用针对int,double等修改的地方特别多&#xff0c;而且使用范围受限&#xff0c;所以本文章没有测试&#xff09; …
阅读更多...
最新文章

Copyright @ 2022~2023