HTML的列表和表单

论坛 期权论坛 期权     
程序员的笔记本   2019-6-29 21:25   3259   0

大家好,我是你们的导师,每天我都会给大家分享一些干货内容(当然了,周末也允许我休息一下哈)。上一次给大家分享了如何给网页添加图片和超链接,那么今天我主要给大家分享下HTML中的列表和表单知识。

1. 列表

列表总共有三种:无序列表、有序列表和定义列表。老师来给大家总结一下。

无序列表:无序列表中列表项和列表项之间不分先后顺序。
  1.      列表项1
  2.      列表项2
  3.      列表项3
  4.      列表项4
复制代码
浏览器默认添加“·”作为先导符号。li不能单独存在,必须包裹在ul里面,反过来说,ul里面只能有li。而li是一个容器级标签,里面可以是任何标签。

有序列表:
  1.      列表项
  2.      列表项
  3.      列表项
复制代码
ol表示ordered list ,意思是有序列表。

定义列表:
  1.      定义标题
  2.      定义描述
  3.      定义标题
  4.      定义描述
  5.      定义标题
  6.      定义描述
复制代码
dl表示definition list 定义列表 。
dt表示definition title 定义标题。
dd表示definition description 定义表述词儿。
dt、dd只能在dl里面;dl里面只能有dt、dd。

2. 表单

表单就是收集用户信息的,就是让用户填写的、选择的。
  1.     欢迎注册本网站
  2.    
  3.         所有的表单内容,都要写在form标签里面
  4.    
复制代码
div的语义是division“分割”,div标签是最最重要的布局标签,div中的所有元素是一个小区域。

form是英语表单的意思,form中间可以添加文本框、密码框、单选按钮、复选框、下拉列表、按钮、文本域等内容。

文本框:
  1. [/code]
  2. 密码框:
  3. [code]
复制代码
单选按钮:
复制代码
radio是“收音机”的意思,input的type的值如果是radio就是单选按钮。需要注意的是必须要有相同的name属性,单选按钮才能互斥。

复选框:
  1. 睡觉
  2. 吃饭
复制代码
下拉列表:
  1.      吃饭
  2.      睡觉
  3.      打豆豆
复制代码
文本域:
  1. [/code]
  2. 普通按钮:
  3. [code]
复制代码
提交按钮:
  1. [/code]
  2. 3. 综合演练
  3. [code]
  4. 表单实战演练
  5. 表单
  6. 请选择您的性别:
  7.   男
  8.   女
  9. 请选择你的爱好:
  10.   睡觉
  11.   吃饭
  12.   足球
  13.   篮球
  14.   乒乓球
  15.   打豆豆
  16. 请选择您的家乡:
  17. 北京
  18. 河北
  19. 河南
  20. 山东
  21. 山西
  22. 湖北
  23. 安徽
  24. 请输入您的账户名:
  25. 请输入您的密码:
  26. 请输入您的建议和要求:
复制代码
效果图:







今天就跟大家分享这么多,最后在这顺便回答下有的同学在微信上问我的问题:为什么很多同学在我们这里学了不到4个月,月薪轻松25K以上

长按扫一扫下面的二维码,我会亲口告诉你答案,一句话,选择大于努力!向有结果的人学习不会有错!


分享到 :
0 人收藏
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

积分:35
帖子:7
精华:0
期权论坛 期权论坛
发布
内容

下载期权论坛手机APP