HTML有哪些列表以及具体的使用!!!

文章目录

  • HTML列表
    • 1、无序列表
    • 2、有序列表
    • 3、自定义列表


HTML列表

html的列表有三种,一种是无序列表,一种是有序列表,还有一种为自定义列表。

1、无序列表

<ul> <li>
无序列表:无序列表基础版 主要使用<ul>标签
和<li>标签无序列表表示只是列表而已,
没有什么顺序之分它的展现形式是由<ul>标签包裹着<li>标签:

代码如下:

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
head>
<body>
    <ul>
        <li>1li>
        <li>2li>
        <li>3li>
    ul>
body>
html>

结果为:
HTML有哪些列表以及具体的使用!!!_第1张图片

2、有序列表

<ol> <li>
有序列表:简单的有序列表 由<ol>标签包裹着<li>标签组成
在网页上显示的时候会有1,2,3,4这样的数字图标显示,
表示为有顺序的显示:

代码如下:

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
head>
<body>
    <ol>
        <li>1li>
        <li>2li>
        <li>3li>
    ol>
body>
html>

结果为:
HTML有哪些列表以及具体的使用!!!_第2张图片

3、自定义列表

自定义列表:简单的自定义列表 由<dl>标签包裹着
<dt><dd>标签组成
dl为声明列表,而dt一般为小标题,dd则为内容

代码如下:

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
head>
<body>
    <dl>
        <dt>123dt>
        <dd>1dd>
        <dd>2dd>
        <dd>3dd>
        <dt>123dt>
        <dd>1dd>
        <dd>2dd>
        <dd>3dd>
        <dt>123dt>
        <dd>1dd>
        <dd>2dd>
        <dd>3dd>
    dl>
body>
html>

结果为:
HTML有哪些列表以及具体的使用!!!_第3张图片

你可能感兴趣的:(前端,html,html5)