<!DOCTYPE html>

<html lang="zh">

    <head>

        <meta charset="UTF-8" />

        <meta name="viewport" content="width=device-width, initial-scale=1.0" />

        <meta http-equiv="X-UA-Compatible" content="ie=edge" />

        <title>select的placeholder和分组效果</title>

    </head>

    <body>

        <select>

            <!--placeholder 效果-->

            <option value="" disabled selected>Select your option</option>

            <!--分组效果-->

            <optgroup label='小学'>

                <option value='5'> 1年级</option>

                <option value='6'> 2年级</option>

                <option value='7'> 3年级</option>

                <option value='8'> 4年级</option>

                <option value='9'> 5年级</option>

                <option value='10'> 6年级</option>

            </optgroup>

        </select>

    </body>

</html>

效果：

select的placeholder和分组效果的更多相关文章

  1. input/select/textarea标签的readonly效果实现

    首先说一下readonly属性的应用场景 表单中,不能编辑对应的文本,但是仍然可以聚焦焦点 在提交表单的时候,该输入项会作为form的一项提交(目的) 这里要说一下disabled和readonly的 ...

  2. select元素中设置padding效果

    更新2016-9-17:这个bug是在mac os上的发生,在window系统中不存在这个问题! 给select元素增加:padding-left:20px;但是未生效,如下图所示: 在select上 ...

  3. Android 开源库StickyListHeadersListView来实现ListView列表分组效果

    项目中有一新的需求,要求能像一些Android机带"联系人列表"一样,数据可以自动分组,且在列表滑动过程中,列表头固定在顶部,效果图如下: 下面就带大家实现上面的效果, 首先,我们 ...

  4. 给select增加placeholder技巧

    转自:http://stackoverflow.com/questions/5805059/how-do-i-make-a-placeholder-for-a-select-box/8442831 使 ...

  5. 用jquery ajax做的select菜单，选中的效果

    //用server端语言赋值给js变量     var departmentId = '<%=提交的值 %>', deviceId='<%=提交的值 %>'     $(fun ...

  6. jQuery效果之封装模拟placeholder效果，让低版本浏览器也支持

    页面中的输入框默认的提示文字一般使用placeholder属性就可以了,即: <input type="text" name="username" pla ...

  7. LINQ简明教程：数据排序、分组、过滤

    LINQ可以对很多数据源进行查询操作,比如数据库.数组(array).链表(list).XML文件等.在本文中,我将从数组中提取数据,这些数据是10个最受欢迎的国家.有一个类叫Countries,有c ...

  8. TSQL 分组集（Grouping Sets）

    分组集(Grouping Sets)是多个分组的并集,用于在一个查询中,按照不同的分组列对集合进行聚合运算,等价于对单个分组使用“union all”,计算多个结果集的并集.使用分组集的聚合查询,返回 ...

  9. 多功能前台交互效果插件superSlide

    平时我们常用的"焦点图/幻灯片""Tab标签切换""图片滚动""无缝滚动"等效果要加载n个插件,又害怕代码冲突又怕不兼容 ...

随机推荐

  1. 在 CentOS 和 RHEL 上安装 Puppet 服务器和客户端

    https://linux.cn/article-3959-1.html https://docs.puppet.com/

  2. SET XACT_ABORT ON 数据库事务

    转载:http://www.cnblogs.com/rob0121/articles/2320932.html SET XACT_ABORT ON SET XACT_ABORT ON分为两种: 1.总 ...

  3. KStudio window上编译uclinux

     可能没有几个人能像我这样在Windows下编译Linux内核,甚至于同时进行内核调试.这种事情我不是第一个做到的,至少我们公司的原TKStudio部门已经做过.在TKStudio网站上,提供了一个L ...

  4. flashcache的实现与分析

    最近,由于项目需要,在做关于flashcache的一些工作,主要涉及模块组织.元数据管理及数据分布.读写流程分析.数据在磁盘和 cache(SSD)之间的调度.缺点及可优化方向等一些方面的分析研究.也 ...

  5. 3种方式实现KVO并进行对比

    KVO KVO属于设计模式中的观察者模式,在观察者模式中,一个对象任何状态的变更都会通知另外的对改变感兴趣的对象.这些对象之间不需要知道彼此的存在,这其实是一种松耦合的设计.当某个属性变化的时候,我们 ...

  6. hue解决timed out(code THRIFTSOCKET):None

    报错栈: Traceback (most recent call last): File , in decorator return func(*args, **kwargs) File , in e ...

  7. C结构体

    什么是结构体? 简单的来说,结构体就是个能够包含不同数据类型的一个结构,他是一种能够自己定义的数据类型,他的特点和数组主要有两点不同,首先结构体能够在一个结构中声明不同的数据类型,第二相同结构的结构体 ...

  8. fisher精确检验(fisher’s exat test)和超几何分布

  9. mac下virtualbox安装win7系统

    下载安装参考: http://win.bai-bang.top/shendu64win7.html 1.之前在win7下的virtualbox安装win7操作溜溜的,换做mac,不知道是不是太久没有安 ...

  10. MyBatis+Spring SQL效率测试报告

    1. 数据库结构 2. insert 测试 insert 的测试包括 1) 批量拼接values()插入 2) 有事务for循环插入 3) 无事务for循环插入 测试 SQL: <!-- 普通 ...