2.html基础标签:无序+有序+自定义列表
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!--
列表:
无序列表:ul+li 列表类型+子项 无顺序的
有序列表:ol+li 列表类型+子类 有顺序的
自定义列表:dl+dt+dd 列表类型+标题+子项 ,一般用于网站底部,下面的服务支持等场景
快速生成代码:
li*6:快速成功6个li标签
ul>li*6:前面加个ul>,表示在生成li之前有个层次关系,通过>实现.但是只是生成框架,里面的子项是空的,因此引出下面的生成代码
ul{子项内容}*生成数:如果想要子类内容出现随生成数变化的数字,可以在{}中加$
优化到最后:ul>li{子项内容$}*生成数,可以一次性完成框架及内容的构建
--> <ul>
<li>无序列表1</li>
<li>无序列表2</li>
<li>无序列表3</li>
<li>无序列表4</li>
<li>无序列表5</li>
</ul> <ol>
<li>有序列表1</li>
<li>有序列表2</li>
<li>有序列表3</li>
<li>有序列表4</li>
<li>有序列表5</li>
</ol> <dl>
<dt>标题1</dt>
<dl>子项1</dl>
<dl>子项2</dl>
<dl>子项3</dl>
<dl>子项4</dl>
<dl>子项5</dl>
</dl> <ol>好吃排行榜
<li>蔬菜</li>
<ul>
<li>子项1</li>
<li>子项2</li>
</ul>
<li>水果</li>
<ul>
<li>子项1</li>
<li>子项2</li>
</ul>
<li>肉</li>
<ul>
<li>子项1</li>
<li>子项2</li>
</ul>
</ol>
</body>
</html>
2.html基础标签:无序+有序+自定义列表的更多相关文章
- HTML基础标签图片文本超链接列表表格介绍
1.HTML基础标签图片常见代码形式<img src="图片路径地址" alt="属性名" title="占位符">常见的图片格 ...
- 我教女朋友学编程html系列(7)—Html无序列表、自定义列表、有序列表及常用例子
昨天写的那篇文章<我教女朋友学编程Html系列(6)—Html常用表单控件>,基本上有1000人左右看了,那边文章是我站在前人的肩膀上修改来的,添加了截图和说明,合并了例子,使之更容易被初 ...
- Android零基础入门第39节:ListActivity和自定义列表项
原文:Android零基础入门第39节:ListActivity和自定义列表项 相信通过前两期的学习,以及会开发最简单的一些列表界面了吧,那么本期接着来学习更多方法技巧. 一.使用ListActivi ...
- Swift基础--使用TableViewController自定义列表
首先建立一个swift项目,把storyboard的内容删掉,添加一个 Navigation Controller,然后设置storyboard对应界面的class,在Navigation Contr ...
- Web开发——HTML基础(高级文本格式 列表/style)
文档资料参考: 参考:https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_fo ...
- HTML概念、语法及常用基础标签
HTML基础语法 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- HTML基础标签学习
HTML基础学习 前言 HTML基础学习会由HTML基础标签学习.HTML表单学习和一张思维导图总结HTML基础三篇文章构成,文章中博主会提取出重点常用的知识和经常出现的bug,提高学习的效率,后续会 ...
- HTML基础标签入门
HTML基础标签 昨天学习了一些HTML的基本标签以及基本属性: HTML是一种超文本标记语言,其中PHP是世界上最好的语言(增加学习的动力荣誉感). HTML文档里包含三部分: <html&g ...
- Html5 基础----列表详述
html5列表 标签 列表分为: 有序列表/无序列表/自定义列表,用的最多的为无序列表和自定义列表 1.有序列表(order list) eg:把
随机推荐
- 预浸料(Prepreg,PreimpregnatedMaterials)
预浸料(Prepreg,PreimpregnatedMaterials),是把基体(Matrix)浸渍在强化纤维(Reinforced Fiber)中制成的预浸片材产品,是复合材料的中间材料.
- BUILDING WITH BOOTSTRAP
BUILDING WITH BOOTSTRAP Bootstrap Generalizations You just built an impressive webpage using the Boo ...
- tcp中delay_ack的理解
内核版本,3.10. 首先,我们需要知道,在一个sock中,维护ack的就有很多变量,多种状态: struct inet_connection_sock { .... __u8 icsk_ca_sta ...
- mui页面传值
以下代码全部在script标签内 一.通过mui.openWindow()打开新页面(若目标页面为已预加载成功的页面,则在openWindow方法中传递的extras参数无效): mui.openWi ...
- Linux上web服务器搭建
安装php依赖包: yum -y install gcc gcc++ libxml2 libxml2-devel yum install gcc make gd-devel libjpeg-devel ...
- 20175126《Java程序设计》第二周学习总结
# 20175126 2016-2017-2 <Java程序设计>第二周学习总结 ## LINUX系统安装好输入法后如何使用? - 相信很多同学在刚接触虚拟机LINUX系统时,会因无法输入 ...
- Cannot resolve method
1.问题描述: 本人idea下拉项目,结果impl里的类满屏的红色 2.解决方法 步骤: File --> Settings --> Plugins -->搜索并安装lom即可
- 《Java程序设计》第二周学习总结(一)
教材学习内容总结 标识符.关键字 基本数据类型 类型转换运算 输入.输出数据 数组 教材学习中的问题和解决过程 问题1:在创建vim并编写完成后出现以下情况 问题1解决方案:打开虚拟机的文件目录,发现 ...
- 【.Net】 大文件可使用的文本分组统计工具(附带源码,原创)
本工具可实现的效果: 1.读取大文件(大于1GB) 2.根据分隔符分割后的列分组 3.速度快. 4.处理过程中,可以随时停止处理,操作不卡死. 5.有对当前内存的实时监测,避免过多占用内存,影响系统运 ...
- jsp相关笔记(一)
1.在html中调整两个<p>标签之间的间距,可以用margin属性: p { margin: 0.2em 0;} 2.在jsp中要对页面分成上.左.右三栏时,可以用<framese ...