1.列表

        (1).有序列表

        概念:有顺序或侧重顺序的列表。

<h2>要把大象放冰箱总共分几步</h2>

<ol>

        <li>把冰箱门打开</li>

        <li>把大象放进去</li>

        <li>把冰箱门关上</li>

</ol>

        (2).无序列表

        概念:无顺序或不侧重顺序的列表。

<h2>我想去的几个城市</h2>

<ul>

        <li>成都</li>

        <li>上海</li>

        <li>西安</li>

        <li>武汉</li>

</ul>

        (3).列表嵌套

        概念:列表中的某项内容,又包含一个列表(注意:嵌套时,请务必把结构写完整)。

<h2>我想去的几个城市</h2>

<ul>

        <li>成都</li>

        <li>

                <span>上海</span>

                <ul>

                        <li>外滩</li>

                        <li>杜莎夫人蜡像馆</li>

                        <li>

                                <a href="https://www.opg.cn/">东方明珠</a>

                        </li>

                        <li>迪士尼乐园</li>

                </ul>

        </li>

        <li>西安</li>

        <li>武汉</li>

</ul>

        注意:li 标签最好写在 ul ol 中,不要单独使用。

        (4).自定义列表

                (1.概念:所谓自定义列表,就是一个包含术语名称以及术语描述的列表。

                (2.一个 dl 就是一个自定义列表,一个 dt 就是一个术语名称,一个 dd 就是术语描述(可以有多个)。

<h2>如何高效的学习?</h2>

<dl>

        <dt>做好笔记</dt>

        <dd>笔记是我们以后复习的一个抓手</dd>

        <dd>笔记可以是电子版,也可以是纸质版</dd>

        <dt>多加练习</dt>

        <dd>只有敲出来的代码,才是自己的</dd>

        <dt>别怕出错</dt>

        <dd>错很正常,改正后并记住,就是经验</dd>

</dl>

2.表格

        (1)基本结构

                (1一个完整的表格由:表格标题、表格头部、表格主体、表格脚注,四部分组成。

                (2.表格涉及到的标签:

                        table:表格

                        caption:表格标题

                        thead:表格头部

                        tbody:表格主体

                        tfoot:表格脚注

                        tr:每一行

                        thtd:每一个单元格(备注:表格头部中用 th ,表格主体、表格脚注中用: td

                (3.具体编码:

<table border="1"><!-- 表格标题 --><caption>学生信息</caption><!-- 表格头部 --><thead><tr><th>姓名</th><th>性别</th><th>年龄</th><th>民族</th><th>政治面貌</th></tr></thead><!-- 表格主体 --><tbody><tr><td>张三</td><td>男</td><td>18</td><td>汉族</td><td>团员</td></tr><tr><td>李四</td><td>女</td><td>20</td><td>满族</td><td>群众</td></tr><tr><td>王五</td><td>男</td><td>20</td><td>回族</td><td>党员</td></tr><tr><td>赵六</td><td>女</td><td>21</td><td>壮族</td><td>团员</td></tr></tbody><!-- 表格脚注 --><tfoot><tr><td></td><td></td><td></td><td></td><td>共计:4人</td></tr></tfoot>
</table>

        (2).常用属性

标签标签语义常用属性单/双 标签
table表格

width:设置表格宽度

height:设置表格最小高度,表格最终可能比设置的值大

border:设置表格边框宽度

cellspacing:设置单元格之间的间距

thead表格头部

height:设置表格头部高度

align:设置单元格的水平对齐方式,可选值如下:

        1.left:左对齐

        2.center:中间对齐

        3.right:右对齐

valign:设置单元格的垂直对齐方式,可选值如下:

        1.top:顶部对齐

        2.middle:中间对齐

        3.bottom:底部对齐

tbody表格主体常用属性与 thead 相同
tr常用属性与 thead 相同
tfoot表格脚注常用属性与 thead 相同
td普通单元格

width:设置单元格的宽度,同列所有单元格全都受影响

height:设置单元格的高度,同行所有单元格全都受影响

align:设置单元格的水平对齐方式

valign:设置单元格的垂直对齐方式

rowspan:指定要跨的行数

colspan:指定要跨的列数

th表头单元格常用属性与 td 相同

注意:

        1. <table> 元素的 border 属性可以控制表格边框,但 border 值的大小,并不控制单元格边框的宽度,只能控制表格最外侧边框的宽度,这个问题如何解决?—— 后期靠 CSS 控制。

        2. 默认情况下,每列的宽度,得看这一列单元格最长的那个文字。

        3. 给某个 th 或 td 设置了宽度之后,他们所在的那一列的宽度就确定了。

        4. 给某个 th 或 td 设置了高度之后,他们所在的那一行的高度就确定了。

        (3).跨行跨列

                (1.rowspan:指定要跨的行数。

                (2.colspan:指定要跨的列数。

3.常用标签补充
标签名标签含义单/双 标签
br换行
hr分隔
pre按原文显示(一般用于在页面中嵌入大段代码)

注意:          

        1. 不要用 <br> 来增加文本之间的行间隔,应使用 <p> 元素,或后面即将学到的 CSS margin 属性。

        2. <hr> 的语义是分隔,如果不想要语义,只是想画一条水平线,那么应当使用 CSS 完成。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.pswp.cn/diannao/99134.shtml
繁体地址,请注明出处:http://hk.pswp.cn/diannao/99134.shtml
英文地址,请注明出处:http://en.pswp.cn/diannao/99134.shtml

如若内容造成侵权/违法违规/事实不符,请联系英文站点网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MySQL中的回表操作

在数据库查询&#xff08;尤其是基于 B树索引 的关系型数据库&#xff0c;如MySQL、PostgreSQL&#xff09;中&#xff0c;“回表”是一个核心且高频出现的概念&#xff0c;直接影响查询性能。要理解回表&#xff0c;需先理清索引结构与数据存储的关联&#xff0c;再拆解其发生…

QT子线程与GUI线程安全交互

在Qt应用程序开发中&#xff0c;涉及到多线程处理时&#xff0c;如何安全地从子线程更新UI界面是一个常见的问题。Qt的UI界面并不是线程安全的&#xff0c;意味着你不能直接在子线程中操作UI组件&#xff08;比如按钮、标签等&#xff09;。如果不遵循线程安全的规则&#xff0…

RL【10-2】:Actor - Critic

系列文章目录 Fundamental Tools RL【1】&#xff1a;Basic Concepts RL【2】&#xff1a;Bellman Equation RL【3】&#xff1a;Bellman Optimality Equation Algorithm RL【4】&#xff1a;Value Iteration and Policy Iteration RL【5】&#xff1a;Monte Carlo Learnin…

开源大模型天花板?DeepSeek-V3 6710亿参数MoE架构深度拆解

文章目录认知解构&#xff1a;DeepSeek的定位与核心价值模型概述与发展历程创立初期与技术奠基&#xff08;2023年7月-2024年11月&#xff09;里程碑一&#xff1a;MoE架构规模化突破&#xff08;2024年12月&#xff09;里程碑二&#xff1a;推理成本革命性优化&#xff08;202…

10 训练中的一些问题

&#x1f31f; 大背景&#xff1a;训练神经网络 下山寻宝 训练神经网络就像你蒙着眼在一座大山里&#xff0c;想找最低点&#xff08;最小损失&#xff09;。你只能靠脚下的坡度&#xff08;梯度&#xff09;来决定往哪儿走。 你的位置 模型参数&#xff08;权重 www&#xf…

synchronized锁升级的过程(从无锁到偏向锁,再到轻量级锁,最后到重量级锁的一个过程)

锁升级是 Java 中 synchronized 锁 的核心优化机制&#xff08;基于 JVM 的 对象头 Mark Word 实现&#xff09;&#xff0c;指锁的状态从 无锁 → 偏向锁 → 轻量级锁 → 重量级锁 逐步升级的过程。其目的是通过 “按需升级”&#xff0c;在不同并发场景下选择最优的锁实现&am…

HOT100--Day25--84. 柱状图中最大的矩形,215. 数组中的第K个最大元素,347. 前 K 个高频元素

HOT100–Day25–84. 柱状图中最大的矩形&#xff0c;215. 数组中的第K个最大元素&#xff0c;347. 前 K 个高频元素 每日刷题系列。今天的题目是《力扣HOT100》题单。 题目类型&#xff1a;栈&#xff0c;堆。 84. 柱状图中最大的矩形 思路&#xff1a; class Solution {publ…

基于 Apache Doris 的用户画像数据模型设计方案

一、 需求分析与设计目标数据源&#xff1a;用户基本信息&#xff1a;用户ID、性别、出生日期、注册时间、常驻地域&#xff08;省、市、区&#xff09;、职业等。用户体检报告&#xff1a;每次体检的报告ID、体检时间、各项指标&#xff08;如血压、血糖、血脂、BMI等&#xf…

Python的深度学习

深入理解Python高级特性掌握Python的高级特性是进阶的关键&#xff0c;包括装饰器、生成器、上下文管理器、元类等。这些特性能够提升代码的灵活性和效率。例如&#xff0c;装饰器可以用于实现AOP&#xff08;面向切面编程&#xff09;&#xff0c;生成器可以处理大数据流而无需…

数据库范式(Normalization)

一个设计混乱的数据库就像一个杂乱的房间&#xff0c;用起来非常不方便&#xff1a;东西到处乱放&#xff08;数据冗余&#xff09;&#xff0c;找件东西要翻遍所有角落&#xff08;查询困难&#xff09;&#xff0c;扔掉一把旧椅子时&#xff0c;可能会把搭在上面的唯一一件外…

数据结构---循环队列

基于循环数组实现的循环队列解决了顺序队列中的假溢出导致的空间浪费问题操作&#xff1a;&#xff08;1&#xff09;初始化//循环队列 typedef struct {int *data;//指针模拟声明数组int head,tail;//队头&#xff0c;队尾 }Queue; //初始化 Queue *InitQueue() {Queue *q (Q…

深入理解线程模型

线程作为操作系统调度的基本执行单元&#xff0c;是实现高吞吐、低延迟系统的基础。一、进程与线程的体系结构对比核心概念&#xff1a;进程&#xff08;Process&#xff09;&#xff1a;操作系统资源分配的基本单位&#xff0c;拥有独立的虚拟地址空间、文件描述符表、环境变量…

TTC定时器中断——MPSOC实战3

开启TTC定时器&#xff0c;不同于7000系列的私有定时器此处设置LPD_LSBUS频率TTC频率取决于LPD_LSBUS可前往指定位置查看参数不使能填写对应宏可前往指定位置查看参数main.c#include <stdio.h> #include "xparameters.h" #include "xgpiops.h" #incl…

人工智能训练师三级备考笔记

一、实操1&#xff09;通用语法&#xff08;常见于实操题第一块代码块&#xff09;1.读取文件数据或加载数据集等描述时一般为以下结构&#xff1a;Datapd.read_文件格式(文件名) 注意&#xff1a;文件名需要用‘ ’框起来&#xff0c;必须要有引号文件格式有以下内容csv、txt…

Cherry Studio递归工具调用机制深度解析

在现代AI应用开发中,工具调用(Tool Calling)已成为大语言模型与外部系统交互的核心机制。Cherry Studio作为一款先进的AI对话客户端,实现了一套完整的递归工具调用系统,能够让AI助手在执行复杂任务时自动调用多个工具,并根据执行结果智能决策下一步操作。本文将深入解析这…

[哈希表]966. 元音拼写检查器

966. 元音拼写检查器 class Solution:def spellchecker(self, wordlist: List[str], queries: List[str]) -> List[str]:origin set(wordlist) # 存储原始单词用于完全匹配lower_to_origin {} # 存储小写形式到原始单词的映射vowel_to_origin {} # 存储元音模糊形…

正则表达式与文本三剑客(grep、sed、awk)基础与实践

正则表达式基础与实践一、正则表达式概述1. 定义正则表达式&#xff08;Regular Expression&#xff0c;简称 RE&#xff09;是用于描述字符排列和匹配模式的语法规则&#xff0c;核心作用是对字符串进行分割、匹配、查找、替换操作。它本质是 “模式模板”&#xff0c;Linux 工…

eclipse中web项目编译后的lib里面jar为空问题处理

1. 检查项目构建配置验证项目性质右键单击项目 → Properties确认项目已正确配置&#xff1a;​Project Facets​&#xff1a;确保已勾选"Dynamic Web Module"​Targeted Runtimes​&#xff1a;确保已选择服务器运行时&#xff08;如Tomcat&#xff09;检查部署程序…

C语言中的递归问题——汉诺塔问题

汉诺塔&#xff08;Tower of Hanoi)&#xff0c;又称河内塔&#xff0c;是一个源于印度古老传说的益智玩具。传说大梵天创造世界的时候做了三根金刚石柱子&#xff0c;在一根柱子上从下往上按照大小顺序摞着64片黄金圆盘。大梵天命令婆罗门把圆盘从下面开始按大小顺序重新摆放在…

ArkAnalyzer源码初步分析I——分析ts项目流程

1.前言&#xff1a; 鸿蒙程序分析框架ArkAnalyzer&#xff08;方舟分析器&#xff09; 源码地址 入门文档 2.阅读入门文档后&#xff1a; 本人具有一定的Java开发经验。虽然我对 TypeScript&#xff08;TS&#xff09;和 ArkTS 还不熟&#xff0c;但很多概念对我这个 Java 开…