<select>标签:

注:该标签定义了下拉列表的实现

 <select name = "location">
    <option value = "1">成都</option>
    	<option value = "2" selected>北京</option>
    	<option value = "3">深圳</option>
    	<option value = "4">延安</option>
</select>

<datalist>标签:

注:

1,该标签定义了输入域的选项列表

2,使用datalist标签必须要和<input>、<form>标签联合起来使用

3,input标签中的list属性值要和datalist标签中的id属性值保持一致

<form action = "list.jsp">
    <input list = "name">
    <datalist id = "name">
    	<option value = "Jake">
    	<option value = "Jane">
    	<option value = "brace">
    	<option value = "honor">
    	<option value = "jame">
    </datalist>
</form>

【HTML5】<datalist>标签和<select>标签的比较的更多相关文章

  1. 03-body标签中相关标签

    今日主要内容: 列表标签 <ul>.<ol>.<dl> 表格标签 <table> 表单标签 <fom> 一.列表标签 列表标签分为三种. 1 ...

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

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

  3. 03-body标签中相关标签-2

    主要内容: 列表标签 <ul>.<ol>.<dl>表格标签 <table>表单标签 <form> 一.列表标签 列表标签分为三种. 无序列表 ...

  4. Day46(列表标签,表格标签,表单标签,css的引入方式,css选择器)

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

  5. html-body标签中相关标签 02

    今日主要内容: 列表标签 <ul>.<ol>.<dl> 表格标签 <table> 表单标签 <fom> 一.列表标签 列表标签分为三种. 1 ...

  6. HTML5 datalist 标签

    以前需要用JS写一个自动完成组件(Suggest),很费劲.HTML5时代则不用了,直接使用datalist标签,直接减少了工作量.如下 <!DOCTYPE html> <html& ...

  7. HTML <select> 标签 创建单选或多选菜单

    所有主流浏览器都支持 <select> 标签. select 元素可创建单选或多选菜单. <select&> 元素中的 <option> 标签用于定义列表中 ...

  8. 自学HTML5第二节(标签篇---新增标签详解)

    HTML5新增标签: <article> 标签 规定独立的自包含内容.一篇文章应有其自身的意义,应该有可能独立于站点的其余部分对其进行分发. <article> 元素的潜在来源 ...

  9. HTML <select> 标签

    定义和用法 select 元素可创建单选或多选菜单. <select&> 元素中的 <option> 标签用于定义列表中的可用选项. HTML 4.01 与 HTML ...

随机推荐

  1. JavaScript使用正则表达

    正则表达式概述 在前面已经涉及了一些正则表达式的用法,现在将系统地学习正则表达式的语法和用途.正则表达式主要用于进行字符串的模式匹配,例如判断一个字符串是否符合指定格式等.例如在windows下搜索文 ...

  2. Android属性动画之ObjectAnimator控制

    Android为我们提供了大量的动画效果,如何通过这些动画来达到我们需要的效果呢?今天就为大家总结一下ObjectAnimator动画控制事件. 该项目的的布局文件只有两个控件:ImageView和B ...

  3. spring源码分析之spring注解@Aspect是如何工作的?

    1.@Aspect 在xml定义:<aop:aspectj-autoproxy />,其定义在http://www.springframework.org/schema/aop/sprin ...

  4. Android中的内存储、外存储概念、文件操作与PC端的有些不同

    其实安卓文件的操作和java在pc环境下的操作并无二致,之所以需要单独讲解是因为安卓系统提供了不同于pc的访问文件系统根路径的api,同时对一个应用的私有文件做了统一的管理.初学者在这部分感到很容易混 ...

  5. ShineTime - 带有 CSS3 闪亮特效的缩略图相册

    ShineTime 是一个效果非常精致的缩略图相册,鼠标悬停到缩略图的时候有很炫的闪光效果,基于 CSS3 实现,另外缩略图也会有立体移动的效果.特别适用于个人摄影作品,公司产品展示等用途,快来来围观 ...

  6. jQuery 实现bootstrapValidator下的全局验证

    前置: 引入jQuery.bootstrap.bootstrapValidator 问题描述: 项目中要求所有的表单输入框中都不能输入&符号.没有在bootstrap中找到有方法可用,只能自己 ...

  7. 使用James搭建一个自己的邮箱服务器

    ---第一天开发--- 下载Apache James 3.0邮箱服务器,解压到响应的目录 可以看到目录结构: H:\code\JavaCode\James\apache-james-3.0-beta4 ...

  8. 原生JS 获取浏览器、窗口、元素等尺寸的方法及注意事项

    一.通过浏览器获得屏幕的尺寸 screen.width screen.height screen.availHeight //获取去除状态栏后的屏幕高度 screen.availWidth //获取去 ...

  9. 【原创】jQuery 仿百度输入标签插件

    1.先上效果图 2.调用方式 <link href="/Styles/tagsinput.css" rel="stylesheet" type=" ...

  10. 在Winform开发中使用日程控件XtraScheduler

    在一些应用场景中,我们可能需要记录某一天,某个时段的日程安排,那么这个时候就需要引入了DevExpress的日程控件XtraScheduler了,这个控件功能非常强大,提供了很好的界面展现方式,以及很 ...