讲师中心 微信公众号
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机游戏
最近更新
首页 > web前端 > html教程 > 正文

网页HTML 有序列表ol 和无序列表 ul_HTML/Xhtml_网页制作

php中文网
发布： 2016-05-16 16:44:02
原创
2306人浏览过

 用于组织数据的列表

学习了这么多控制网页显示的HTML标签，读者可以初步制作纯文章页面了。本节学习HTML中的列表元素，列表形式在网站设计中占有比较大的比重，显示信息非常整齐直观，便于用户理解。在后面的CSS样式学习中将大量使用到列表元素的高级作用。

文本框: 图4.17 列表元素的结构

 4.4.1  列表的结构组成

HTML的列表元素是一个由列表标签封闭的结构，包含的列表项由

  • 组成。具体结构如图4.17所示。

     4.4.2  制作无序列表

    立即学习“前端免费学习笔记（深入）”；

    顾名思义，无序列表就是列表结构中的列表项没有先后顺序的列表形式。大部分网页应用中的列表均采用无序列表，其列表标签采用

      ，编写方法如下：

      企业建站系统2.0
      企业建站系统2.0

      系统是针对于企业用户量身打造的一款简单的程序，只要你懂一点html语言你就可以轻轻松松的创建一个自己的企业官网，品牌官网、为了更好的让各位开发者可以简单的制作自己满意的模板，我们官网论坛提供了模板变量(模板标签)可以让大家轻松制作自己的企业官网。 更新说明：修复专题页面添加产品不显示问题 功能列表：1.设置中心2.分类栏目3.关于我们4.联系我们5.招聘中心6.留言方式7.支持伪静态8.支持生成静

      企业建站系统2.0 0
      查看详情 企业建站系统2.0

         

      • 列表项一

        •  

      • 列表项二

        •  

      • 列表项三

        •  

      • 列表项四

        •  

      • 列表项五

       4.4.3  制作有序列表

      顾名思义，有序列表就是列表结构中的列表项有先后顺序的列表形式，从上到下可以有各种不同的序列编号，如1、2、3或a、b、c等。在D:\web\目录下创建网页文件，命名为ul_ol.htm，编写代码如代码4.17所示。

      代码4.17  列表的设置：ul_ol.htm

      html>

       

      列表的设置

      网页前台技术

         

      • HTML

        •  

      • CSS

        •  

      • JavaScript

        •  

      • FLASH

      网页后台的学习

         

      1. ASP

        2.  

      2. ASP.net

        3.  

      3. PHP

        4.  

      4. CGI

        5.  

      5. Ruby

        6.  

      6. Python

      相关标签：
      html

      大家都在看：

      • HTML速学教程(入门课程)
      HTML速学教程(入门课程)

      HTML怎么学习？HTML怎么入门？HTML在哪学？HTML怎么学才快？不用担心，这里为大家提供了HTML速学教程(入门课程)，有需要的小伙伴保存下载就能学习啦！

      下载
      来源：php中文网
      收藏 点赞
      上一篇：HTML 特殊字符彻底剖析_HTML/Xhtml_网页制作 下一篇：ul和li 基本用法分析_HTML/Xhtml_网页制作
      本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
      最新问题
      html表单如何二选一_实现HTML表单二选一选项【选项】 应优先使用单选按钮（radio）配合相同name属性，因其语义正确、原生互斥且无需脚本；其次可选下拉菜单、复选框+JS、按钮组+hiddeninput或fieldset分组等方案。
      2025-12-16 19:02:37
      149
      如何写好html首页_编写吸引人的HTML网站首页指南【指南】 创建美观实用的HTML首页需协同用户视觉动线、内容层级与语义化标记：一明确核心信息架构；二用HTML5语义标签构建骨架；三控制视觉焦点与阅读节奏；四嵌入基础可访问性保障；五精简脚本与资源引用。
      2025-12-16 19:01:02
      331
      html5设置行距样式_line-height属性控制行高【教程】 HTML5中可通过line-height属性控制文本行高，支持像素值、无单位数值、百分比、em单位及内联样式五种方法，分别适用于精确排版、响应式缩放、比例计算等不同场景。
      2025-12-16 18:55:59
      456
      如何查看编写的html_查看浏览器中HTML代码方法【代码】 可通过五种方式查看HTML源代码：一、右键选择“查看网页源代码”；二、用开发者工具的“元素”面板看实时DOM；三、地址栏加view-source:前缀；四、输入about:source或chrome://view-source/命令；五、用文本编辑器直接打开文件。
      2025-12-16 18:45:08
      232
      html5如何加横线_HTML5添加横线方法与分隔线技巧【详解】 HTML5中实现横线分隔有五种方法：一、语义化标签；二、CSS边框属性；三、伪元素::before/::after；四、SVG矢量绘制；五、linear-gradient背景渐变模拟。
      2025-12-16 18:40:58
      849
      写完html怎么运行_写完html文件运行步骤【指南】 首先正确保存HTML文件为.html格式并使用浏览器打开。具体步骤包括：将文件以.html扩展名保存，避免.txt后缀；双击文件或通过浏览器菜单“打开文件”加载；可借助编辑器插件如LiveServer实现自动刷新预览。
      2025-12-16 18:37:02
      252
      HTML表单如何动态相加_JavaScript计算实现指南【方案】 可实现HTML表单实时求和的五种方案：一、input事件监听固定输入框；二、委托事件监听父容器；三、output元素配合oninput属性；四、data属性分组计算；五、现代API与可选链处理边界情况。
      2025-12-16 18:36:00
      244
      html怎么运行exe文件_html运行exe文件方法【教程】 浏览器禁止HTML直接运行EXE以防恶意操作，需通过自定义协议、Electron类桌面应用或本地服务代理等方案间接实现，且均需用户参与或特定环境支持。
      2025-12-16 18:34:02
      373
      js里html怎么运行_js中运行html方法【教程】 使用innerHTML可直接插入HTML但有XSS风险；insertAdjacentHTML支持精准插入且性能更优；DOMAPI创建元素最安全，适合处理用户输入。
      2025-12-16 18:31:02
      928
      html的视频如何下载_从HTML页面下载视频文件方法【文件】 可通过五种方法下载网页嵌入的HTML视频：一、检查源代码获取src或source中的直链；二、用开发者工具Network捕获媒体请求；三、安装VideoDownloadHelper等扩展识别下载；四、用curl/wget命令行下载直链；五、用N_m3u8DL-CLI等工具处理HLS/DASH流。
      2025-12-16 18:24:59
      171
      相关专题
      更多>
      热门推荐
      开源免费商场系统广告
      热门教程
      更多>
      相关推荐
      热门推荐
      最新课程
      最新下载
      更多>
      网站特效
      网站源码
      网站素材
      前端模板
      关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
      php中文网：公益在线php培训，帮助PHP学习者快速成长！
      关注服务号 技术交流群
      PHP中文网订阅号
      每天精选资源文章推送

      Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

    • PHP学习

    • 技术支持

    • 返回顶部