前端开发_HTML5_标签部分(三)
2021/12/12 23:47:22
本文主要是介绍前端开发_HTML5_标签部分(三),对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
一、列表标签(ul-li/ol-li/dl-dt-dd)
1.无序列表:ul-li
(1)、该标签的作用:无序列表的作用是使得每一个项没有顺序之分进行排列,而在每个项目文字之前,使用符号作为对应的分项标记。
(2)、标签语法以及相关的属性
标签语法以及相关的属性 <ul type="符号显示设置"> <li>列内容1</li> <li>列内容2</li> ... </ul> 相关的属性: type:该属性用于指定列表项的开始的符号,取值为disc(默认值,实心圆点)、circle(空心圆)、square(实心正方形)
(3)、ul/li标签的代码使用以及效果
学生姓名: <ul> <li>张三</li> <li>李四</li> <li>王五</li> <li>王麻子</li> </ul> 喜欢吃的水果: <ul type="circle"> <li>苹果</li> <li>石榴</li> <li>葡萄</li> <li>火龙果</li> </ul> 最喜欢的图书: <ul type="square"> <li>百年孤独</li> <li>了不起的盖茨比</li> <li>呼啸山庄</li> <li>傲慢与偏见</li> </ul>
2.有序列表:ol-li
(1)、该标签的作用:有序列表使用编号编排项目,而不是项目符号。列表的项目采用数字或者是英文字母开头,按照大小对列表项进行排版。
(2)、标签语法以及相关的属性
标签语法 <ol type="符号显示设置" start="设置开始项值"> <li>列内容1</li> <li>列内容2</li> ... </ol> 常用属性 type:用于设置序列类型,一般取值有1(数字1)、a(小写字母a)、A(大写字母A)、i(小写罗马数字)和I(大写的罗马数字)。 start:用于设置序列的开始值,这一个参数只对数字有效。
(3)、ol/li标签的代码使用以及效果
学生成绩排名 <ol> <li>张三</li> <li>李四</li> <li>王五</li> <li>王麻子</li> </ol> 想吃的水果顺序: <ol type="A"> <li>苹果</li> <li>石榴</li> <li>葡萄</li> <li>火龙果</li> </ol> 想欢的图书: <ol type="1" start="10"> <li>百年孤独</li> <li>了不起的盖茨比</li> <li>呼啸山庄</li> <li>傲慢与偏见</li> </ol>
3.自定义列表:dl-dt-dd
(1)、该标签的作用:自定义列表不仅仅是一列项目,而是项目及其注释的组合。该标签可以实现图文的混排效果。
(2)、标签语法以及相关的属性
这篇关于前端开发_HTML5_标签部分(三)的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-11-15AntDesign项目实战:新手入门与初级应用教程
- 2024-11-15AntDesign-Form-rules项目实战:新手指南
- 2024-11-14ESLint课程:初学者指南
- 2024-11-14Form.List 动态表单课程:新手入门教程
- 2024-11-14Redux课程:新手入门完全指南
- 2024-11-13MobX 使用入门教程:轻松掌握前端状态管理
- 2024-11-12前端编程资料:新手入门指南与初级教程
- 2024-11-12前端开发资料入门指南
- 2024-11-12前端培训资料:适合新手与初级用户的简单教程
- 2024-11-12前端入门资料:新手必读指南