HTML基础(二)列表标签

HTML基础(二)列表标签,第1张

概述无序列表ul ul标签的格式为 <ul> <li>内容1</li> <li>内容2</li> <li>内容3</li> </ul> <html ><head> <title>Title</title> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/></head 无序列表ul

ul标签的格式为

@H_502_10@<ul>
<li>内容1</li>
<li>内容2</li>
<li>内容3</li>
</ul>

@H_502_10@<HTML ><head> <Title>Title</Title> <Meta http-equiv="Content-Type" content="text/HTML;charset=utf-8"/></head><body> <h1>HTML 属性赋予元素意义和语境</h1> <p>HTML 全局属性</p> <ul> <li>规定激活元素的快捷键</li> <li>规定元素内容是否可编辑</li> <li>规定元素是否可拖动</li> </ul></body></HTML> VIEw Code

效果

如果不想用圆点,想用方块只需要在ul标签里加上type属性就可以了,属性有

@H_502_10@disc: 圆点 默认square: 正方形circle: 空心圆 @H_419_179@

@H_502_10@<HTML ><head> <Title>Title</Title> <Meta http-equiv="Content-Type" content="text/HTML;charset=utf-8"/></head><body> <h1>HTML 属性赋予元素意义和语境</h1> <p>HTML 全局属性</p> <ul type="disc"> <li>规定激活元素的快捷键</li> <li>规定元素内容是否可编辑</li> <li>规定元素是否可拖动</li> </ul> <ul type="square"> <li>规定激活元素的快捷键</li> <li>规定元素内容是否可编辑</li> <li>规定元素是否可拖动</li> </ul> <ul type="circle"> <li>规定激活元素的快捷键</li> <li>规定元素内容是否可编辑</li> <li>规定元素是否可拖动</li> </ul></body></HTML> VIEw Code

在来刷新看看效果

有序列表ol

 

@H_502_10@ol标签的格式为<ol> <li>内容1</li> <li>内容2</li> <li>内容3</li>                                                                         </ol>

@H_502_10@<HTML ><head> <Title>Title</Title> <Meta http-equiv="Content-Type" content="text/HTML;charset=utf-8"/></head><body> <h1>HTML 属性赋予元素意义和语境</h1> <p>HTML 全局属性</p> <ol > <li>规定激活元素的快捷键</li> <li>规定元素内容是否可编辑</li> <li>规定元素是否可拖动</li> </ol></body></HTML> VIEw Code

有序列表的type属性

@H_502_10@1 数字1,2a 小写字母a,bA 大写字母A,Bi 小写罗马数字iI 大写罗马数字I

@H_502_10@<HTML ><head> <Title>Title</Title> <Meta http-equiv="Content-Type" content="text/HTML;charset=utf-8"/></head><body> <h1>HTML 属性赋予元素意义和语境</h1> <p>HTML 全局属性</p> <ol type="a"> <li>规定激活元素的快捷键</li> <li>规定元素内容是否可编辑</li> <li>规定元素是否可拖动</li> </ol> <ol type="i"> <li>规定激活元素的快捷键</li> <li>规定元素内容是否可编辑</li> <li>规定元素是否可拖动</li> </ol> <ol type="I"> <li>规定激活元素的快捷键</li> <li>规定元素内容是否可编辑</li> <li>规定元素是否可拖动</li> </ol></body></HTML> VIEw Code

效果

定义列表

基本格式 dl,dt,dd三个是一起出现的,缺一不可

@H_502_10@<dl> <dt>定义列表项</dt> <dd>列表项描述</dd> <dd>列表项描述</dd> <dt>定义列表项</dt> <dd>列表项描述</dd> <dd>列表项描述</dd> ...</dl>

@H_502_10@<HTML ><head> <Title>Title</Title> <Meta http-equiv="Content-Type" content="text/HTML;charset=utf-8"/></head><body> <dl> <dt>我是列表</dt> <dd>我是描述1</dd> <dd>我是描述2</dd> <dt>我是列表</dt> <dd>我是描述1</dd> <dd>我是描述2</dd> </dl></body></HTML> VIEw Code

效果

总结

以上是内存溢出为你收集整理的HTML基础(二)列表标签全部内容,希望文章能够帮你解决HTML基础(二)列表标签所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1071999.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-26
下一篇 2022-05-26

发表评论

登录后才能评论

评论列表(0条)

保存