html5——列表、表格

目录

列表 

无序列表

有序列表

自定义列表

表格 

基本结构 

示例 

表格的跨列 

表格的跨行 


列表 

无序列表

<ul>【声明无序列表】

      <li>河间驴肉火烧</li>【声明列表项】

      <li>唐山棋子烧饼</li>

      <li>邯郸豆沫</li>

      <li>石家庄金毛狮子鱼</li>

 </ul>

 

无序列表的特性:

  1. 没有顺序,每个<li>标签独占一行(块元素) 
  2. 默认<li>标签项前面有个实心小圆点
  3. 一般用于无序类型的列表,如导航、侧边栏新闻、有规律    的图文组合模块等

有序列表

<ol>【声明有序列表】

  <li>驴肉火烧</li>【声明列表项】

  <li>京东煨肘子</li>

  <li>牛肉罩饼</li>

  <li>缸炉烧饼</li>

</ol>

有序列表的特性:

  1. 有顺序,每个<li>标签独占一行(块元素) 
  2. 默认<li>标签项前面有顺序标记
  3. 一般用于排序类型的列表,如试卷、问卷选项等

自定义列表

<dl>【声明定义列表】

    <dt>水果</dt>【声明列表项】

    <dd>苹果</dd>【定义列表项内容】

    <dd>桃子</dd>

    <dd>李子</dd>

</dl>

 定义列表的特性:

  1. 没有顺序,每个<dt>标签、<dd>标签独占一行(块元素)
  2. 默认没有标记
  3. 一般用于一个标题下有一个或多个列表项的情况

表格 

基本结构 

  • 单元格 
  •  

示例 

<table>【表格标签】

    <tr>【行标签】

         <th>11列的标题</th>【单元格标题标签】

         <th>12列的标题</th>

    </tr>

    <tr>

         <td>11列的单元格</td>【单元格标签】

         <td>12列的单元格</td>

    </tr>

</table>

表格的跨列 

<table>

  <tr>

    <td colspan="2">学生成绩</td>【所跨的列数】

  </tr>

  <tr>

    <td>语文</td>

  <td>98</td>

  </tr>

  <tr>

<td>数学</td>

<td>95</td>

</tr>

</table>

 

表格的跨行 

<table >

  <tr>

    <td rowspan="n">&nbsp;</td>

    <td>&nbsp;</td>

  </tr>

  <tr>

    <td>&nbsp;</td>

  </tr>

</table>

 

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

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

相关文章

opencv实现目标检测功能----20240704

早在 2017 年 8 月,OpenCV 3.3 正式发布,带来了高度改进的“深度神经网络”(dnn)模块。 该模块支持多种深度学习框架,包括 Caffe、TensorFlow 和 Torch/PyTorch。这次我们使用Opencv深度学习的功能实现目标检测的功能,模型选用MobileNetSSD_deploy.caffemodel。 模型加载…

机器学习与深度学习:区别与联系(含工作站硬件推荐)

一、机器学习与深度学习区别 机器学习&#xff08;ML&#xff1a;Machine Learning&#xff09;与深度学习&#xff08;DL&#xff1a;Deep Learning&#xff09;是人工智能&#xff08;AI&#xff09;领域内两个重要但不同的技术。它们在定义、数据依赖性以及硬件依赖性等方面…

空中交通新动能!2024深圳eVTOL展动力电池展区核心内容抢先看!

空中交通新动能&#xff01;2024深圳eVTOL展动力电池展区核心内容抢先看&#xff01; 关键词&#xff1a;2024深圳eVTOL展 动力电池 高能量密度电池 高性能电池材料 作为2024深圳eVTOL展重要组成部分&#xff0c;2024深圳eVTOL动力电池展将于9月23-25日在深圳坪山燕子湖国际会…

基于JAVA+SpringBoot+Vue的社区普法平台

✌全网粉丝20W,csdn特邀作者、博客专家、CSDN新星计划导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ &#x1f345;文末获取项目下载方式&#x1f345; 一、项目背景介绍&#xff1a; 社区普法平台旨在为社…

Python程序封装成Windows服务实践

1. WinSW 工具概述 WinSW&#xff08;Windows Service Wrapper&#xff09;是一个轻量级的、开源的工具&#xff0c;用于将任何可执行文件&#xff08;包括exe、jar、脚本文件等&#xff09;包装成一个Windows服务。这意味着&#xff0c;原本设计为命令行应用或需要手动启动的…

内存条必备知识

什么是内存条&#xff1f; 内存条&#xff1a;又称为随机存取存储器&#xff08;RAM&#xff09;&#xff0c;也叫主存&#xff0c;是与CPU直接交换数据的内部存储器。它可以随时读写&#xff08;刷新时除外&#xff09;&#xff0c;而且速度很快&#xff0c;通常用来暂时存储…

了解劳动准备差距:人力资源专业人员的战略

劳动准备差距是一个紧迫的问题&#xff0c;在全球人事部门回应&#xff0c;谈论未开发的潜力和错过的机会。想象一下&#xff0c;人才和需求之间的悬崖之间有一座桥&#xff0c;这促使雇主思考&#xff1a;我们是否为员工提供了足够的设备来应对未来的考验&#xff1f; 这种不…

碳化硅陶瓷膜的基本性能

碳化硅陶瓷膜作为一种由碳化硅(SiC)材料制成的高温陶瓷膜&#xff0c;以其独特的性能在多个领域得到了广泛的应用。以下是碳化硅陶瓷膜的基本性能&#xff0c;详细阐述如下&#xff1a; 一、电绝缘性 碳化硅陶瓷膜通常具有较好的电绝缘性&#xff0c;这一特性在高温环境中尤为重…

牛刀小试--下三角对称矩阵压缩存储

解析博客: 矩阵存储和特殊矩阵的压缩存储_n阶对称矩阵压缩-CSDN博客 函数功能: //为N阶下三角矩阵初始化成的一维数组分配空间 void Init_triangular_matrix(int *&matrix); //返回二维下三角矩阵的值(压缩存取) int get_Value_triangular_matrix(int matrix[],int x,int …

物流数据分析成本利润计算软件,佳易王物流货运单管理系统操作教程

前言&#xff1a; 物流数据分析成本利润计算软件&#xff0c;佳易王物流货运单管理系统操作教程 以下软件操作教程以&#xff0c;佳易王物流单统计分析软件为例说明 软件文件下载可以点击最下方官网卡片——软件下载——试用版软件下载 一、软件操作教程 1、佳易王物流货运…

数字人+展厅互动体验方案:多元化互动方式,拓宽文化文娱新体验

数字化创新已成为推动展厅可持续发展&#xff0c;创造全新消费体验&#xff0c;满足游客多元化需求的关键力量。 “数字人数字互动展厅”可以适应年轻一代的文化传播与多媒体互动新体验趋势&#xff0c;打造新生代潮玩聚集地&#xff0c;促进文化创意传播与互动体验场景创新&a…

CC2530寄存器编程学习笔记_按键中断

目录 无中断按键 第一步 分析原理图 电路工作原理 第二步 配置寄存器 第一步 配置为通用IO口 第二步 配置为输入 第三步 输入模式选择 按键抖动 中断按键 第一步中断寄存器的配置 上升沿 下降沿 第一步 开启总中断使能 第二步 开启端口中断使能 第三步 开启端口引…

传统中小企业如何布局短视频矩阵?云微客说别踩坑

如今社会&#xff0c;不管是老少都在刷短视频&#xff0c;短视频已经成为大家受欢迎的内容形式之一了。很多企业和个人看到了短视频赛道的这个商机&#xff0c;纷纷投身于短视频制作中&#xff0c;都想为了能够在竞争激烈的市场中脱颖而出。 但是&#xff0c;短视频账号并不是一…

精益思维驱动未来:人工智能产品设计的新篇章

在科技日新月异的今天&#xff0c;人工智能&#xff08;AI&#xff09;已经渗透到我们生活的方方面面&#xff0c;从智能家居到自动驾驶&#xff0c;从医疗诊断到金融服务&#xff0c;AI的应用场景越来越广泛。然而&#xff0c;如何确保AI产品在设计之初就具备高效、灵活和可持…

ITIL4认证考试注意事项(附考试答题攻略)

作为一位持有ITIL4中级认证的IT服务管理专家&#xff0c;我深知备考ITIL4认证考试的重要性。在此分享我的复习备考经验&#xff0c;帮助你顺利通过考试。 1. 制定复习计划 制定详细的复习计划是备考的第一步。合理安排每天的复习时间&#xff0c;重点复习ITIL4的关键概念、四个…

CSS 【实用教程】(2024最新版)

CSS 简介 CSS 是层叠样式表( Cascading Style Sheets ) 的简写&#xff0c;用于精确控制 HTML 页面的样式&#xff0c;以便更好地展示图文信息或产生炫酷/友好的交互体验。 没有必要让所有浏览器都显示得一模一样的&#xff0c;好的浏览器有更好的显示&#xff0c;糟糕的浏览器…

E. Beautiful Array(cf954div3)

题意&#xff1a;给定一个数组&#xff0c;可以先对数组进行任意排序&#xff0c;每次操作可以选择一个ai&#xff0c;将它变成aik&#xff0c; 想让这个数组变成一个美丽数组&#xff08;回文数组&#xff09;&#xff0c;求最少操作次数 分析&#xff1a; 先找出相同的数字…

C++Windows环境搭建(CLion)

文章目录 CLion下载安装CLion下载CLion安装新建项目新建一个文件基础设置字体设置clion中单工程多main函数设置 参考 CLion下载安装 CLion下载 打开网址&#xff1a;https://www.jetbrains.com/clion/download/ 点击Download进行下载。 CLion安装 双击下载好的安装包&…

华为浏览器,Chrome的平替,插件无缝连接

文章目录 背景插件书签 背景 不知道各位小伙伴有没有这样的痛点&#xff0c;办公电脑、家里的电脑还有手机、平板等&#xff0c;收藏了一个网址或者在手机上浏览了某个网页&#xff0c;保存起来&#xff0c;可是一换平台或者换个电脑&#xff0c;在想要浏览之前收藏的东西&…

伺服【禾川X6】

驱动器&#xff1a; A&#xff1a;脉冲 B&#xff1a;EtherCAT // SV-X6 FB 040 AA 一套360 N&#xff1a;CANopen R&#xff1a;PROFINET 电机&#xff1a; SV-X6 MA 040A-B2 KA