列表及表格的使用

最新推荐文章于 2024-02-19 11:08:35 发布

AG。

最新推荐文章于 2024-02-19 11:08:35 发布

阅读量535

点赞数 1

文章标签： html5 css

本文链接：https://blog.csdn.net/zjt200013/article/details/125832714

版权

本文详细介绍了HTML5中的列表类型，包括无序列表、有序列表和自定义列表的使用，常见于导航栏和底部导航。同时，还探讨了表格的创建，包括表格标签的运用、表格内容的组织以及如何设置边框和合并单元格。

摘要由CSDN通过智能技术生成

1.列表

在HTML中，常见的列表形式有三种：

1.无序列表：常用导航栏。

一般使用ul定义无序列表，他的默认样式是上下有16px外边距，值会根据内容文本大小改变；左内边距40px，li是列表的项，默认无序列表有“圆点”，可通过css属性改变。

如图所示：

2.有序列表

一般用ol定义有序列表，他的默认样式也是上下有16px外边距，值会根据内容文本大小改变；左内边距40px，li是列表的项，与无序列表不同的是默认有序列表有“阿拉伯数字”，可以通过HTML改变。

列表默认的类型：

1.默认值，阿拉伯数字。

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

AG。

关注关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
列表及表格的使用

通常dl定义自定义列表，默认样式上下有16px外边距，值会根据内容文本大小改变；dt定义列表的项，dd是对于列表项的描述。
复制链接

扫一扫

列表与表格

logical_thinking的博客

07-28

238

随着我们的学习我们开始学列表与表格，在我们使用电脑的时候打开浏览器例如百度首页我们会看到下面的这就是用到了列表以上就是今天要讲的内容，本文仅仅简单介绍了列表与表格，而列表与表格在我们编写代码时能够减少我们一定的时间、并且在以后的编码中我们会经常用到。https。...

表格列表

kxindouhao5491的博客

08-21

242

SPAN <span>标签的作用：能让某几个文字或者某个单词凸显出来 <p>享受<span class="show">"北大式"</span>教育服务</p> <p>在青鸟，有老师默默支持你成就<span id="dream">IT梦想&am

参与评论您还未登录，请先登录后发表或查看评论

表格、列表、表单

最新发布

2301_80448965的博客

02-19

995

例子：效果：我们以后见到这种解释说明的结构就用自定义列表。

HTML中的列表和表格

李嘉豪的博客

02-22

453

目录 HTML 列表 无序列表 有序列表定义列表 HTML 表格表格表格和边框属性表格的表头表格中的空单元格表格标签 HTML 列表 无序列表 无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。 无序列表始于 <ul> 标签。每个列表项始于 <li>。 <ul> <li>Cof...

HTML列表、表格、表单

zhao1519937848的博客

06-13

400

1.无序列表<ul><li></li>...</ul> 有序列表<ol><li></li>...</ol> (type来规定有序列表的是以数字还是字母等排序，start来表示从第几个开始) 自定义列表<dl><dt></dt><dd></dd&gt...

HTML中列表和表格

哈皮吖的博客

12-04

664

一、HTML 列表 HTML 包含有序、无序和定义列表: 1、HTML 列表有序列表格式： 1、第一个列表项 2、第二个列表项 3、第三个列表项代码实现 &lt;h4&gt;有序列表&lt;/h4&gt; &lt;ol&gt; &lt;li&gt;语文&lt;/li&gt; &lt;li&gt;数学

列表与表格（自己的学习分享）

hzx229的博客

03-12

1761

列表表格

一文搞懂HTML中的表格、表单、列表

一个非常Cool的人

01-21

2502

讲述了表格、表单、列表的语法,举例了代码如何使用,并对其适合做什么工作进行了分析。

无序列表写导航栏

letthesunshinein的博客

07-25

2170

今天开始写之前一个同学给的博客试着写出来但是我已经忘得差不多了啊啊啊啊啊啊

网页前端：导航菜单的制作

sky-stars的博客

11-22

2300

实验目的：（1）掌握有序列表和无序列表，在导航菜单中的工作过程；（2）导航菜单能够根据鼠标的悬浮进行样式的变化。实验内容：根据要求完成以下网页菜单：1、使用无序列表和超链接完成菜单；2、鼠标悬停菜单后，菜单样式发生变化。（1）掌握有序列表和无序列表，在导航菜单中的工作过程；（2）导航菜单能够根据鼠标的悬浮进行样式的变化。

Python全栈开发学习--HTML--CSS导航栏练习--Day5

Mnioc的博客

02-23

454

前言回顾前面几天学习的内容，一共学了标签，css样式，盒模型，以及定位，下面将使用之前学习到的内容做几个小案例。从而巩固所学知识。一、竖向导航栏 1.1 方法：用无序列表构建表单 <ul> <li><a href="#">主页</a></li> <li><a href="#">新闻</a>&lt...

无序列表如何做一个导航条?html&,如何使用无序列表制作导航菜单.docx

weixin_29182481的博客

06-04

3613

第一步：建立一个无序列表我们先建立一个无序列表，来建立菜单的结构。代码是：首页产品介绍服务介绍技术支持立刻购买联系我们第二步：隐藏li的默认样式因为看起来不是很好看，菜单通常都不需要li默认的圆点，我们给UL定义一个样式来消除这些圆点。当然，为了更好的控制整个菜单，我们把菜单放在一个div里。页面代码变成：首页产品介绍服务介绍技术支持立刻购买联系我们 CSS定义为：.test ul{list-s...

HTML列表标签出现边距问题的解决方式

WRZUP的博客

08-30

1627

.background{ background-color:green; wilih:100%; height:70px; margin:0px; } body{ margin:0px; padding:0px;} 首页时装趋势嘉人美妆嘉人观点珠宝腕表

转：使用无需列表制作导航菜单。

weixin_33916256的博客

05-04

308

使用无序列表制作导航菜单 无序列表在Web页面中的用途除了Div，Table，Form外，我们最常用的Html元素之一就是无序列表ul，使用它通常可以实现以下形式： 1.实现文本数据列表，这是无序列表的原始意图。 2.嵌套使用无序列表，以实现树状结构。 3.修改无序列表的样式，将它作为菜单使用。相对于用表格制作的菜单项，它修改起来比较方便，样式也很容易设置。...

解决a-table设置固定宽度后有空白列的问题

前端路上坎坎坷坷，总有一天站在顶峰仰望世界！！！

02-17

1080

【代码】解决a-table设置固定宽度后有空白列的问题。

CSS笔记

wang544831183的博客

08-01

464

Css样式（cascading style sheet）层叠样式表 Body a .box{ } Css的目的：给html加各种各样的样式----html结构和css样式样式分离---便于维护更新 Css语法选择器{属性名:属性值; 属性名:属性值; } 说明：一个css样式包括选择器和格式声明语句选择器就是选择给哪个html标签加样式格式声明

html改变元素外边距,CSS 简明教程 - 外边距 ( margin ) 属性

weixin_34755543的博客

06-04

2719

CSS margin 属性用于在 HTML 元素周围创建「空白」，这些空白在元素的边框之外创建我们可以单独设置元素的上边距，下边距，左边距和右边距，也可以使用 margin 属性同时设置所有边距下图显示了填充 ( margin ) 和外边距 ( margin) 之间的关系，红线是元素的边框margin 属性接受任何长度单位，可以是像素 px，英寸，毫米或 em外边距属性值值说明auto设置外...

CSS-列表样式

m0_50555031的博客

05-20

2195

介绍CSS的列表样式及属性

无序列表，有序列表，锚点链接，相对路径，

m0_73749787的博客

09-16

195

1：以当前html文件为原点，（参照物）去建立关系,当期目录'上一级目录‘下一级目录。当前目录./+文件名（如果你的当前html和图片在同一目录 ./可以不用写）作用：提示文本，当鼠标悬停在链接上时会显示里面文字。self：当前窗口打开（默认值）特点：指向同一位置《无论在何处使用。../表示上一级目录。默认间距（上下外边距，内边距）导航新闻列表、产品列表。默认样式：间距（外简距、内间距）列表样式：实心小圆点。默认带下划线，自带颜色。target：指定目标地址的打开方式。自定义列表：对专业名词进行解释。

css基本语法（二）——表格列表边距尺寸浮动和清除

tcbdbd的博客

07-28

502

表格把两个单元格相邻的边框线合并为一条线，去掉表格边框之间的空隙要放在<table></table>里 border-collapse:collapse; 设置表格悬停样式 td:hover{background: blue;color: yellow;} 列表给列表加图标 ul li{list-style-image: url(img/1145584.gif)}...