当前位置： 首页 > news >正文

HTML详解连载（2）

news 2026/4/21 19:42:19

HTML详解连载（2）

  • 专栏链接 [link](http://t.csdn.cn/xF0H3)
    • 下面进行专栏介绍
  • 开始喽
    • 超链接
      • 作用
      • 代码示例
      • 解释
      • 经验分享
    • 音频标签
      • 代码示例
      • 注意
      • 强调
    • 视频标签
      • 代码示例
      • 注意
      • 强调
    • 列表
      • 作用：布局内容排列整齐的区域。
      • 分类：无序列表，有序列表，定义列表
      • 无序列表
        • 作用
        • 标签
        • 示例
        • 注意事项：
      • 有序列表
        • 作用
        • 标签
        • 示例：
        • 注意事项：
      • 定义列表
        • 标签
        • 示例
        • 注意事项：
    • 表格-基本用法
      • 标签
      • 标签名及说明
      • 注意事项：
    • 表格结构标签
      • 作用
    • 合并单元格
      • 作用
      • 步骤

专栏链接 link

下面进行专栏介绍

本专栏是自己学前端的征程，纯手敲的代码，自己跟着黑马课程学习的，并加入一些自己的理解，对代码和笔记
进行适当修改。希望能对大家能有所帮助，同时也是请大家对我进行监督，对我写的代码进行建议，互相学习。

开始喽

在这里插入图片描述

超链接

作用

点击跳转到其他页面。

代码示例

  <a href=”https://www.baidu.com”>跳转到百度</a>

解释

href属性值是跳转地址，是超链接的必须属性。
属性加上target=”_black”新窗口打开页面

经验分享

开发初期，不知道超链接的跳转地址。href属性写#，表示空链接，不会跳转。

音频标签

代码示例

	<audio src=”音频的URL”></audio>

注意

常见属性作用特殊说明
src（必须属性）音频URL支持格式：MP3、Ogg、Wav
controls显示音频控制面板
loop循环播放
autoplay自动播放为提升用户体验，浏览器一般会禁用自动播放功能

强调

在HTML5中，如果属性名和属性值完全一样，可以简写为一个单词

在这里插入图片描述

视频标签

代码示例

<video src=”视频的URL”></video>

注意

常见属性作用特殊说明
src（必须属性）音频URL支持格式：MP4、Ogg、WabM
controls显示视频控制面板
loop循环播放
autoplay自动播放为提升用户体验，浏览器支持在静音状态自动播放功能

强调

在浏览器中，想要自动播放，必须有muted属性

列表

作用：布局内容排列整齐的区域。

分类：无序列表，有序列表，定义列表

无序列表

作用

布局排列整齐的不需要规定顺序的区域

标签

ul嵌套li，ul是无序列表，li是列表条目

示例

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

在这里插入图片描述

注意事项：

ul标签里面只能包裹li标签
li标签里面可以包裹任何内容

有序列表

作用

布局排列整齐的需要规定顺序的区域

标签

ol嵌套li，ol是有序列表，li是列表条目

示例：

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

注意事项：

ol标签里面只能包裹li标签
li标签里面可以包裹任何内容

定义列表

标签

dl嵌套dt和dd，dl是定义列表，dt是定义列表的标题，
dd是定义列表的描述 /详情

示例

<dl><dt>列表标题</dt><dd>列表描述 / 详情</dd>……
</dl>

注意事项：

dl里面只能包含dt和dd
dt和dd里面可以包含任意内容

表格-基本用法

网页中的表格与Excel表格类似，用来展示数据。

标签

table嵌套tr，tr嵌套td/th

标签名及说明

标签名说明
table表格
tr行
th表头单元格
td内容单元格

注意事项：

在网页中，表格默认没有边框线，使用border属性可以为表格添加边框线

表格结构标签

作用

用表格结构标签把内容划分区域，让表格结构更清晰，语义更清晰

标签名含义特殊说明
thead表格头部表格头部内容
tbody表格主体主要内容区域
tfoot表格底部汇总信息区域

合并单元格

作用

将多个 单元格合并成一个单元格，以合并同类信息

步骤

1.明确合并目标
2.保留最左最上的单元格，添加属性（取值是数字，表示需要合并的单元格数量）
跨行合并，保留最上的单元格，添加属性rowspan
跨列合并，保留最左单元格，添加属性colspan
3.删除其他单元格

相关文章：

HTML详解连载（2）

HTML详解连载&#xff08;2&#xff09; 专栏链接 [link](http://t.csdn.cn/xF0H3)下面进行专栏介绍 开始喽超链接作用代码示例解释经验分享 音频标签代码示例注意强调 视频标签代码示例注意强调 列表作用&#xff1a;布局内容排列整齐的区域。分类&#xff1a;无序列表&#x…...

编程日记 2023/8/13 5:17:57

qt事件系统源码-----定时器

qt定时器的使用一般有以下几种方式&#xff1a; 1、直接使用QTimer对象&#xff0c;绑定定时器的timeout信号&#xff1b; 2、使用QTimer的静态方法singleshot方法&#xff0c;产生一个一次性的定时事件 3、在QObject子类中&#xff0c;调用startTimer方法&#xff0c;产生定…...

编程日记 2023/8/13 5:16:56

【Android】ViewBinding+DataBinding+MVVM新手快速上手

为什么写这篇博客 网上大部分博客&#xff0c;代码量都比较大&#xff0c;把实际的业务都代入进去了 这篇博客的目的&#xff0c;就是为了讲解基本原理和使用思路&#xff0c;然后给出一个最简单的Demo 这里不讲解具体用法&#xff0c;那样篇幅会太长&#xff0c;直接看Demo…...

编程日记 2023/8/13 5:15:55

生成式人工智能模型：提升营销分析用户体验

使用生成式人工智能来改善分析体验&#xff0c;使业务用户能够询问有关我们数据平台中可用数据的任何信息。 在本文中&#xff0c;我们将解释如何使用新的生成式人工智能模型 ( LLM ) 来改善业务用户在我们的分析平台上的体验。假设我们为零售销售经理提供 Web 应用程序或移动应…...

编程日记 2023/8/13 5:14:53

【并发编程】无锁环形队列Disruptor并发框架使用

Disruptor 是苹国外厂本易公司LMAX开发的一个高件能列&#xff0c;研发的初夷是解决内存队列的延识问顾在性能测试中发现竟然与10操作处于同样的数量级)&#xff0c;基于Disruptor开发的系统单线程能支撑每秒600万订单&#xff0c;2010年在QCn演讲后&#xff0c;获得了业界关注…...

编程日记 2023/8/13 5:13:50

【C语言】初阶指针详解

大家好&#xff0c;我是苏貝&#xff0c;本篇博客带大家了解C语言中令人头疼的指针&#xff0c;如果大家觉得我写的不错的话&#xff0c;可以给我一个赞&#x1f44d;吗&#xff0c;感谢❤️ 使用的是VS2019编译器&#xff0c;默认为32位平台 文章目录 ①指针是什么②指针定义与…...

编程日记 2023/8/13 5:12:49

ElasticSearch：项目实战（1）

es环境搭建参考&#xff1a;ElasticSearch&#xff1a;环境搭建步骤_Success___的博客-CSDN博客 需求&#xff1a; 用户输入关键可搜索文章列表 关键词高亮显示 文章列表展示与home展示一样&#xff0c;当用户点击某一篇文章&#xff0c;可查看文章详情 思路&#xff1a; …...

编程日记 2023/8/13 5:11:48

React 实现文件分片上传和下载

React 实现文件分片上传和下载 在开发中&#xff0c;文件的上传和下载是常见的需求。然而&#xff0c;当面对大型文件时&#xff0c;直接的上传和下载方式可能会遇到一些问题&#xff0c;比如网络传输不稳定、文件过大导致传输时间过长等等。为了解决这些问题&#xff0c;我们…...

编程日记 2023/8/13 5:10:47

2023.8.13

atcoder_abc\AtCoder Beginner Contest 310\E_NAND_repeatedly //题意&#xff1a;给定一个n长度的01串&#xff0c;计算f(l,r)(l<r,l在1~n,r在1~n)的和,f的计算(ai,a(i1))运算,有0就为1,11为0 //若f(l,r)1,则f(l,r-1)为0或sr为0,即只取决于上一位的情况和当前位&#xff…...

编程日记 2023/8/13 5:09:45

kvm not all arguments converted during string

kylin virt-manager 远程镜像制作问题记录(not all arguments ) 项目场景&#xff1a; 服务器端安装的OS版本&#xff1a;Kylin-Server-10-SP1-Release-Build20-20210518-arm64-2021-05-18 客户端安装的OS版本&#xff1a;Kylin-Server-10-SP1-Release-Build20-20210518-x86_…...

编程日记 2023/8/13 5:08:44

JVM 基础

巩固基础&#xff0c;砥砺前行 。 只有不断重复&#xff0c;才能做到超越自己。 能坚持把简单的事情做到极致&#xff0c;也是不容易的。 JVM 类加载机制 JVM 类加载机制分为五个部分&#xff1a;加载&#xff0c;验证&#xff0c;准备&#xff0c;解析&#xff0c;初始化&am…...

编程日记 2023/8/13 5:07:40

智谷星图赵俊：让人才和区块链产业“双向奔赴”丨对话MVP

区块链产业需要什么样的人才&#xff1f;赵俊很有发言权。 赵俊是北京智谷星图科技有限公司的技术总监&#xff0c;也是FISCO BCOS官方认证讲师。他2017年接触区块链&#xff0c;随后选择人才培育领域深耕。“为区块链行业引进更多人才这件事很有价值&#xff0c;跟我的职业理…...

编程日记 2023/8/13 5:06:39

C# Equals()方法报错：NullReferenceException was unhandled

下面是一个C# Equals()方法的例子&#xff0c;执行时报错了 static void Main(string[] args) {string name "sandeep";string myName null;Console.WriteLine(" operator result is {0}", name myName);Console.WriteLine("Equals method result…...

编程日记 2023/8/13 5:05:38

Linux下C语言调用libcurl库获取天气预报信息

一、概述 当前文章介绍如何在Linux&#xff08;Ubuntu&#xff09;下使用C语言调用libcurl库获取天气预报的方法。通过HTTP GET请求访问百度天气API&#xff0c;并解析返回的JSON数据&#xff0c;可以获取指定城市未来7天的天气预报信息。 二、设计思路 【1】使用libcurl库进…...

编程日记 2023/8/13 5:04:36

“深入解析JVM：Java虚拟机原理和内部结构“

标题&#xff1a;深入解析JVM&#xff1a;Java虚拟机原理和内部结构 摘要&#xff1a;本文将深入解析JVM&#xff08;Java虚拟机&#xff09;的原理和内部结构。我们将从JVM的基础概念开始&#xff0c;逐步介绍其组成部分&#xff0c;包括类加载器、运行时数据区、字节码解释器…...

编程日记 2023/8/13 5:03:34

Arrays.asList() 返回的list不能add,remove

一.Arrays.asList() 返回的list不能add,remove Arrays.asList()返回的是List,而且是一个定长的List&#xff0c;所以不能转换为ArrayList&#xff0c;只能转换为AbstractList 原因在于asList()方法返回的是某个数组的列表形式,返回的列表只是数组的另一个视图,而数组本身并没…...

编程日记 2023/8/13 5:02:33

命令执行漏洞

1、命令执行漏洞 1.1、简介 Django是用Python开发的一个免费开源的Web结构&#xff0c;几乎包括了Web使用方方面面&#xff0c;能够用于快速建立高性能、文雅的网站&#xff0c;Diango提供了许多网站后台开发常常用到的模块&#xff0c;使开发者可以专注于业务部分。 1.2、漏…...

编程日记 2023/8/13 5:01:32

Hive 中 sort by 和 order by 的区别

文章目录 数据量大小区别作用范围 在 Hive 中&#xff0c; SORT BY 和 ORDER BY 都用于对查询结果进行排序&#xff0c;但它们在实现方式和适用场景上有一些区别。 数据量大小区别 SORT BY&#xff1a; SORT BY 用于在 Hive 中对查询结果进行排序&#xff0c;它的主要特点是在…...

编程日记 2023/8/13 5:00:31

网络资源利用最大化：爬虫带宽优化解决方案

大家好&#xff0c;作为一名专业的爬虫程序员&#xff0c;我们都知道在爬取大量数据的过程中&#xff0c;网络带宽是一个十分宝贵的资源。如果我们不合理地利用网络带宽&#xff0c;可能会导致爬虫任务的效率低下或者不稳定。今天&#xff0c;我将和大家分享一些优化爬虫带宽利…...

编程日记 2023/8/13 4:59:30

STDF - 基于 Svelte 和 Tailwind CSS 打造的移动 web UI 组件库，Svelte 生态里不可多得的优秀项目

Svelte 是一个新兴的前端框架&#xff0c;组件库不多&#xff0c;今天介绍一款 Svelte 移动端的组件库。 关于 STDF STDF 是一个移动端的 UI 组件库&#xff0c;主要用来开发移动端 web 应用。和我之前介绍的很多 Vue 组件库不一样&#xff0c;STDF 是基于近来新晋 js 框架 S…...

编程日记 2023/8/13 4:58:29

Autoware避障从入门到放弃？手把手教你修复关键订阅话题与源码（ROS Melodic/Kinetic）

Autoware避障模块深度解析&#xff1a;从源码修复到实战调优 在自动驾驶系统的开发过程中&#xff0c;避障功能无疑是核心安全模块之一。Autoware作为开源自动驾驶框架的标杆&#xff0c;其避障实现却常常让开发者陷入调试困境——明明按照文档配置了所有节点&#xff0c;车辆却…...

编程新知 2026/4/21 19:11:50

终极Typora插件系统：62个高级功能完全指南与性能优化方案

终极Typora插件系统&#xff1a;62个高级功能完全指南与性能优化方案 【免费下载链接】typora_plugin Typora plugin. Feature enhancement tool | Typora 插件&#xff0c;功能增强工具 项目地址: https://gitcode.com/gh_mirrors/ty/typora_plugin Typora插件系统是一…...

编程新知 2026/4/21 18:57:33

Nano-Banana创意用法：除了拆解图，还能为电商营销生成这些惊艳内容

Nano-Banana创意用法&#xff1a;除了拆解图&#xff0c;还能为电商营销生成这些惊艳内容 1. 重新认识Nano-Banana&#xff1a;不止于拆解 提到Nano-Banana&#xff0c;很多人的第一反应是“那个做产品爆炸图的AI工具”。没错&#xff0c;它确实能生成专业的产品拆解图、Knol…...

编程新知 2026/4/21 18:52:37

从GPT到T5：深入理解Transformer解码器的‘因果掩码’（Causal Mask）及其在PyTorch中的实现

从GPT到T5&#xff1a;深入理解Transformer解码器的‘因果掩码’及其实现 在自然语言处理领域&#xff0c;Transformer架构彻底改变了序列建模的方式。2017年那篇开创性的论文《Attention Is All You Need》不仅引入了自注意力机制&#xff0c;还埋下了后来各种变体模型的种子…...

编程新知 2026/4/21 18:35:30

KEA128与S32K144的LIN主从机实战：从硬件对接到波形调试全记录

KEA128与S32K144的LIN总线异构通信实战&#xff1a;从硬件设计到波形分析的完整指南 在汽车电子系统中&#xff0c;LIN总线作为CAN网络的补充&#xff0c;广泛应用于车门、座椅、空调等低复杂度控制场景。本文将基于NXP KEA128和S32K144两款不同架构的MCU&#xff0c;构建一个完…...

编程新知 2026/4/21 17:23:40

网页图片格式转换难题：如何3秒内解决格式不兼容问题？

网页图片格式转换难题&#xff1a;如何3秒内解决格式不兼容问题&#xff1f; 【免费下载链接】Save-Image-as-Type Save Image as Type is an chrome extension which add Save as PNG / JPG / WebP to the context menu of image. 项目地址: https://gitcode.com/gh_mirrors…...

编程新知 2026/4/21 16:47:32

保姆级教程：手把手教你用第三种方法修复ClickHouse只读表（附详细命令）

ClickHouse表只读状态精准修复实战指南 遇到ClickHouse表突然变成只读状态&#xff0c;就像开车时突然发现方向盘锁死一样让人措手不及。这种状况通常发生在ZooKeeper压力过大或元数据丢失时&#xff0c;但别担心&#xff0c;本文将带你深入理解问题本质&#xff0c;并掌握一种…...

编程新知 2026/4/21 16:04:36

KMS激活脚本：5分钟免费激活Windows和Office的完整指南

KMS激活脚本&#xff1a;5分钟免费激活Windows和Office的完整指南 【免费下载链接】KMS_VL_ALL_AIO Smart Activation Script 项目地址: https://gitcode.com/gh_mirrors/km/KMS_VL_ALL_AIO 你是否在为Windows系统和Office办公软件的激活问题而烦恼&#xff1f;面对复杂…...

编程新知 2026/4/21 15:34:06

别再只跑模拟了！用Gromacs分析工具挖掘你轨迹里的隐藏信息

从轨迹文件到科研洞察&#xff1a;Gromacs分析工具实战指南 分子动力学模拟生成的轨迹文件就像一座未经开采的金矿&#xff0c;大多数研究者只挖掘了表面的一小部分。当你花费数周甚至数月时间运行模拟&#xff0c;最终得到的轨迹文件中其实隐藏着大量有价值的科学信息。本文将…...

编程新知 2026/4/21 15:32:03

已解决Spring Cloud 2022+中FeignClient启动报错：No Feign Client for loadBalancing defined

1. 问题现象与错误分析 最近在升级到Spring Cloud 2022.0.x和Spring Boot 3.x后&#xff0c;很多开发者都遇到了一个典型的启动报错&#xff1a;"No Feign Client for loadBalancing defined"。这个错误通常发生在服务启动阶段&#xff0c;控制台会打印出一长串的依赖…...

编程新知 2026/4/21 15:09:40