常用的HTML5列表标签


Posted in HTML / CSS onJune 20, 2017

 一、列表标签作用

作用:给一堆数据添加列表语义,也就是告诉搜索引擎告诉浏览器这一堆数据是一个整体

二、列表标签分类:

1、无序列表unorderd list:给一堆数据添加列表语义,并且一堆数据中所有的数据都没有先后之分

格式:

<ul>
    <li>需要显示的条目内容</li>
</ul>

注意:ul标签是给列表内容添加语义的不是添加小圆点的;ul标签和li标签是一个整体,一起出现;ul标签中不推荐包含其它标签,可以在li标签中添加其它标签

如何快速编写ul格式:ul>li*3 按tab键 生成一对ul标签,3对li标签

应用场景为新闻/商品列表/导航条

2、有序列表orderd list:

<ol>
       <li>xxx<li>
  </ol>

3、定义列表definition list:

<dl>
    <dt></dt>
    <dd></dd>
</dl>

dt: definition title定义标题

dd: definition description定义标题的描述

应用场景:网站底部的描述信息;图文混排

注意点:dl和dt、dd是一个整体,一起出现,dl中建议只放dt、dd;一个dt可以没有对应的dd,也可以有多个dd,建议一个dt对应一个dd;需要丰富界面时,可以在dt和dd标签中添加其它标签

以上所述是小编给大家介绍的HTML5列表标签,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

HTML / CSS 相关文章推荐
使用CSS3实现字体颜色渐变的实现
Mar 09 HTML / CSS
CSS3教程:边框属性border的极致应用
Apr 02 HTML / CSS
CSS3实现圆角、阴影、透明效果并兼容各大浏览器
Aug 08 HTML / CSS
用纯css3实现的图片放大镜特效效果非常不错
Sep 02 HTML / CSS
CSS3属性background-size使用指南
Dec 09 HTML / CSS
用React加CSS3实现微信拆红包动画效果
Mar 13 HTML / CSS
详解HTML5 Canvas绘制不规则图形时的非零环绕原则
Mar 21 HTML / CSS
解决html5中video标签无法播放mp4问题的办法
May 07 HTML / CSS
canvas实现滑动验证的实现示例
Aug 11 HTML / CSS
CSS3新特性详解(五):多列columns column-count和flex布局
Apr 30 HTML / CSS
CSS实现单选折叠菜单功能
Nov 01 HTML / CSS
使用CSS设置滚动条样式
Jan 18 HTML / CSS
HTML5本地存储之IndexedDB
Jun 16 #HTML / CSS
localstorage和sessionstorage使用记录(推荐)
May 23 #HTML / CSS
Html5实现文件异步上传功能
May 19 #HTML / CSS
Html5新标签datalist实现输入框与后台数据库数据的动态匹配
May 18 #HTML / CSS
HTML5中indexedDB 数据库的使用实例
May 11 #HTML / CSS
详解HTML5 window.postMessage与跨域
May 11 #HTML / CSS
HTML5拖放API实现拖放排序的实例代码
May 11 #HTML / CSS
You might like
简单谈谈php中的unicode和utf8编码
2015/06/10 PHP
PHP开发APP端微信支付功能
2017/02/17 PHP
PHP底层运行机制与工作原理详解
2020/07/31 PHP
JQuery 前台切换网站的样式实现
2009/06/22 Javascript
jQuery 定时局部刷新(setInterval)
2010/11/19 Javascript
关于jquery append() html时的小问题的解决方法
2010/12/16 Javascript
Jquery弹出窗口插件 LeanModal的使用方法
2012/03/10 Javascript
在JavaScript中使用对数Math.log()方法的教程
2015/06/15 Javascript
JS实现表单验证功能(验证手机号是否存在,验证码倒计时)
2016/10/11 Javascript
如何用JS/HTML将时间戳转换为“xx天前”的形式
2017/02/06 Javascript
详解nodejs的express如何自动生成项目框架
2017/07/12 NodeJs
使用vue脚手架(vue-cli)搭建一个项目详解
2019/05/09 Javascript
jquery实现Ajax请求的几种常见方式总结
2019/05/28 jQuery
Vue+Typescript中在Vue上挂载axios使用时报错问题
2019/08/07 Javascript
vue 实现单选框设置默认选中值
2019/11/07 Javascript
VUEX-action可以修改state吗
2019/11/19 Javascript
详解vue实现坐标拾取器功能示例
2020/11/18 Vue.js
Python实现简单的可逆加密程序实例
2015/03/05 Python
python与C互相调用的方法详解
2017/07/14 Python
Python 的类、继承和多态详解
2017/07/16 Python
Python将图片转换为字符画的方法
2020/06/16 Python
对numpy中的transpose和swapaxes函数详解
2018/08/02 Python
python创建文件备份的脚本
2018/09/11 Python
python 实现视频 图像帧提取
2019/12/10 Python
Python+OpenCV实现将图像转换为二进制格式
2020/01/09 Python
python matplotlib模块基本图形绘制方法小结【直线,曲线,直方图,饼图等】
2020/04/26 Python
python pyg2plot的原理知识点总结
2021/02/28 Python
请介绍一下Ant
2016/07/22 面试题
Java如何调用外部Exe程序
2015/07/04 面试题
应届生体育教师自荐信
2013/10/03 职场文书
优秀党支部事迹材料
2014/01/14 职场文书
网络管理员岗位职责
2014/03/17 职场文书
2014年政风行风工作总结
2014/11/22 职场文书
三傻大闹宝莱坞观后感
2015/06/03 职场文书
Python字典和列表性能之间的比较
2021/06/07 Python
Python的property属性详细讲解
2022/04/11 Python