首先我上个图来告诉大家什么是列表

左侧的这一部分就可以称为是列表或者叫树，其实我们可以通过div+css实现列表，可是考虑语义化的问题，我们还是看看html提供好的列表标签，html提供了两种列表，一种是无序列表，一种是有序列表。可是实际开发中我们只是在用无序列表，因为它好扩展，我可以通过font awesome添加我们想要的图片作为序号标识，这样岂不是更好。那么，看一个简单的无序列表的例子：

<!DOCTYPE html>

<html>

<head lang="zh">

    <meta charset="UTF-8">

</head>

<body>

<!--ul标签向界面上添加一个数据列表-->

<ul>

    <!--li标签用来定义列表项-->

    <li>咖啡</li>

    <li>茶</li>

    <li>牛奶</li>

</ul>

</body>

</html>

界面上显示效果如下，如果要去掉列表项前面的黑色小点，可以通过css实现。

表单标签通常分为好几种类型，一般有文本输入框，单选框，复选框，下拉列表。

来看下面简单的例子：

<!DOCTYPE html>

<html>

<head lang="zh">

    <meta charset="UTF-8">

</head>

<body>

<!--form标签用来定义一个表单组-->

<form>

    <!--可以通过指定input元素的type属性来指定输入框是单选框，文本输入框等-->

    文本输入框：<input type="text" name="textinput">

    <br>

    <input type="radio" name="sex" value="male" checked>Male

    <input type="radio" name="sex" value="female">Female

    <!--select标签用来指定一个下拉列表-->

    <select name="cars">

        <option value="volvo">Volvo</option>

        <option value="saab">Saab</option>

        <option value="fiat">Fiat</option>

        <option value="audi">Audi</option>

    </select>

</form>

</body>

</html>

界面效果如下：

Kure讲HTML_列表标签及表单标签的更多相关文章

  1. Day46（列表标签，表格标签，表单标签，css的引入方式，css选择器）

    一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...

  2. 5.22 HTML 列表标签和表单标签

    1,ul无序列表 标签 ul:unordered list ,就是无序列表的意思. li:  listitem  列表项的意思.无序列表的每一项都是<li>. <!DOCTYPE h ...

  3. HTML的表格标签，列表标签，表单标签，HTML5有哪些新特性

    欢迎大家去博客冰山一树Sankey,浏览效果更好.直接右上角搜索该标题即可 博客园主页:博客园主页-冰山一树Sankey CSDN主页:CSDN主页-冰山一树Sankey 前端学习:学习地址:黑马程序 ...

  4. [原创]java WEB学习笔记62：Struts2学习之路--表单标签:form,表单标签的属性，textfield, password, hidden，submit ，textarea ，checkbox ，list, listKey 和 listValue 属性，select ，optiongroup ，checkboxlist

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

  5. 028、HTML 标签3表单标签插入组件

    内容:表单标签插入组件(经常使用)############################################################## form表单标签和input组件 < ...

  6. 制作Html标签以及表单、表格内容

    制作Html一般用DW(......),Html全称为(Hyper Text Markup Language   超文本标记语言) 文本就是平常电脑上的文本文档,只能存储文字,而超文本文档可以存储音乐 ...

  7. struts2：表单标签

    目录 表单标签1. form标签2. submit标签3. checkbox标签4. checkboxlist标签5. combobox标签6. doubleselect标签7. head标签8. f ...

  8. python 全栈开发，Day46(列表标签,表格标签,表单标签,css的引入方式,css选择器)

    一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...

  9. 【HTML】--- 列表、表格、form表单标签

    Html常用标签(2) 上篇博客讲了些常用的html标签 :[HTML]---常用标签(1) 这里主要讲 列表.表格标签和 form表单标签. 一.列表.表格标签 1.列表标签 概念 把内容以列表的形 ...

随机推荐

  1. ConfigParser简介

    一.ConfigParser简介 ConfigParser 是用来读取配置文件的包.配置文件的格式如下:中括号“[ ]”内包含的为section.section 下面为类似于key-value 的配置 ...

  2. javascript 文本框值变化触发事件

    javascript 文本框值变化触发事件jo.find(".price").bind('input onpropertychange', function () { me.cal ...

  3. c++滚动数组

    说来惭愧,我老早以前就学习了dp,可直到最近才知道滚动数组. 所以说,滚动数组是什么呢? 它是一种优化dp空间复杂度的思想. 在dp转移时,我们往往不需要之前推的所有的,而是只需要前一两个转移的. 我 ...

  4. Django之博客系统：增加标签

    一般在发表博客后会给每个帖子加上一个标签.类似帖子关键字的功能.在这一章中来看下如何给博客添加标签功能(tagging) 添加标签需要集成第三方的Django标签应用来完成这个功能.django-ta ...

  5. MySql数据库内部常用命令大全

    1.     连接Mysql 格式: mysql -h主机地址 -u用户名 -p用户密码 1)         连接到本机上的MYSQL. 首先打开DOS窗口,然后进入目录mysql\bin,再键入命 ...

  6. 屏幕字段不允许直接输入，只能通过SearchHelp(F4)

    ---恢复内容开始--- REPORT  z_barry_test NO STANDARD PAGE HEADING . PARAMETERS: p_date TYPE sy-datum ,      ...

  7. There is no row in position 0

    更改程序池 管道模式 ---->经典    常见设置问题: 32位启用

  8. PHP删除目录下包含某个字符串的全部文件

    //获取全部的路径 function tree(&$arr_file, $directory, $dir_name='') { $mydir = dir($directory);    whi ...

  9. linux下将当前目录下的文件名存到一个文本文件里

    如果只是想得到当前目录下(不包括子目录)的相关文件时:ls -l | grep  ".gz$" > 1.txt 如果想得到当前目录下,包括子目录中的相关文件时,应该用find ...

  10. SprimgMVC学习笔记（二）—— 整合Mybatis

    一.整合思路 1.1 Dao层 SqlMapConfig.xml:空文件即可,但是需要文件头. applicationContext-dao.xml 数据库连接池 SqlSessionFactory对 ...