HTML 中的 dl(dt,dd)、ul(li)、ol(li) 使用方法

   2015-08-09 0
核心提示:这篇文章主要介绍了HTML 中的 dl(dt,dd)、ul(li)、ol(li) 使用方法,需要的朋友可以参考下

HTML <dl> 标签

#定义和用法

<dl> 标签定义了定义列表(definition list)。
<dl> 标签用于结合 <dt> (定义列表中的项目)和 <dd> (描述列表中的项目)。

#实例


复制代码
代码如下:

<dl>
<dt>计算机</dt>
<dd>用来计算的仪器 ... ...</dd>
<dt>显示器</dt>
<dd>以视觉方式显示信息的装置 ... ...</dd>
</dl>

HTML <ul> 标签

#定义和用法

<ul> 标签定义无序列表。

#实例

无序 HTML 列表:


复制代码
代码如下:

<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>

HTML <ol> 标签

#定义与用法

<ol> 标签定义有序列表。

#实例

有序 HTML 列表:


复制代码
代码如下:

<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>

ul可以结合ol定义菜单及子菜单


复制代码
代码如下:

<ul>
<li><a href="#">内容过滤</a><li>
<li><a href="#">词语过滤</a></li>
<li class="s">
<div class="lsub">
<div>论坛</div>
<ol>
<li><a href="#">论坛主题管理</a></li>
<li><a href="#">论坛批量删帖</a></li>
</ol>
</div>
</li>
<ul>

 
标签: dl DT dd ul li ol
反对 0举报 0 评论 0
 

免责声明:本文仅代表作者个人观点,与乐学笔记(本网)无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
    本网站有部分内容均转载自其它媒体,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责,若因作品内容、知识产权、版权和其他问题,请及时提供相关证明等材料并与我们留言联系,本网站将在规定时间内给予删除等相关处理.

  • react-native-gesture-handler报错 react native debugger
    react-native-gesture-handler报错 react nativ
    安装React Native第三方组件出现Task :react-native-gesture-handler:compileDebugJavaWithJavac FAILED报错,则使用jetifier解决问题。再运行react-native run-android(或者是react-native run-ios)即可BUILD SUCCESSFUL。 
    03-08
  • 彻底解决Webpack打包慢的问题:npm run build:dll
    彻底解决Webpack打包慢的问题:npm run build:dl
    转载自:https://segmentfault.com/a/1190000006087638?utm_source=weekly&utm_medium=email&utm_campaign=email_weekly我们先来看一下完全没有任何优化的时候,Webpack 的打包速度(使用了jsx和babel的loader)。下面是我们的测试文件://test.jsvar react =
    03-08
  • webpack打包后bundle.js文件过大的问题 webpack
    由于webpack将所有的文件合并到一个js文件。因此打包后的文件过大,导致网络请求不畅。今天尝试了一下webpack打包。结果打出来3.6M。因为之前在本地测试的原因,一直用的webpack -w的命令。即监控入口文件有无改动,若有改动,则自动编译。更改命令:webpack
    03-08
  • Div+CSS布局实例:用dl dt dd来制作列表
    关于用DIV+CSS来制作列表的时候,大家最常用的是用ul和li来编写,但是这样用出现两个比较麻烦的地方:  1、如果用UL还布局,右边一栏比较麻烦;  2、文字外边的边框自适应比较麻烦;  3、很可能要定死高度;  所以,细细地看一看这个布局,想一想还是用
    03-08
  • webpack-bundle-analyzer 插件配置使用方法
    webpack-bundle-analyzer 插件配置使用方法
    目录一、webpack-bundle-analyzer 是什么?二、安装三、使用方法1. 作为插件使用2. 作为CLI的一个工具参考文章:一、webpack-bundle-analyzer 是什么?webpack-bundle-analyzer 是 webpack 的插件,需要配合 webpack 和 webpack-cli 一起使用。这个插件可以读
    03-08
  • 浅析webpack里module/chunk/bundle区别、filena
    一、module,chunk 和 bundle 的区别  看 webpack 文档的时候,对这 3 个名词云里雾里的,感觉他们都在说打包文件,但是一会儿 chunk 一会儿 bundle 的,逐渐就迷失在细节里了,所以我们要跳出来,从宏观的角度来看这几个名词。  webpack 官网对 chunk 和
    02-08
  • webpack2进阶之多文件,DLL,以及webpack-merge
    本需要对webpack已有一定的了解,如果你没接触过webpack或者刚刚接触webpack,可以考虑先看一下我的这篇教程。入门教程##1.打包多文件之前,当需要打包多个而文件时,我是这么写的:```javascriptmodule.exports={entry:{"page/main/main":'./src/js/index.js
    02-08
  • React Native使用 DeviceEventEmitter发送通知e
    js 向 js 发送数据DeviceEventEmitter.emit('自定义名称',发送数据); 例:边看边买退出登录之后,我的淘宝和详情页的钱包数据应该改变。这时,我们可以在退出登录请求返回退出登录成功时发送一个通知    userInfo.userLogout((success) = {  if (su
    02-08
  • html之dl标签 dl标签的使用方法
    html之dl标签 dl标签的使用方法
    用来定义列表之用通常与dt:定义列表中的项目    dd:描述列表中的项目示例代码:dldt数据库/dtddoracle/ddddmysql/ddddvertica/dddt操作系统/dtddWindows/ddddLinux/ddddUnix/dd/dl效果图: 
    02-08
  • webpack性能优化方式之dll---webpack.dll.config.js
    webpack性能优化方式之dll---webpack.dll.confi
    为什么需要优化相信使用过webpack的童鞋应该有体会到,在文件相对较庞大时,webpack的构建速度是非常慢的,那这样的话对我们的开发人员来说体验非常不好。优化的方式性能优化方式有很多,这里来介绍一下dll,dll是一种最简单粗暴并且极其有效的优化方式,且我
    02-08
点击排行