<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>搜索</title>

    <!--定义图标以及图标显示-->

    <link rel="shortcut icon" href="image/rose.jpg">

</head>

<body>

<form action="https://www.sogou.com/web">

    <div>

    <input type="text" name="query" value="陈凯">

    <input type="submit",value="搜索"/>

        </div>

</form>

<form enctype="multipart/form-data">

            <div>

        <p>请选择性别</p>

                <!--此处input 设置name属性就是为了三者只能选其1 value的值可以任意，三者相同即可

                提交的值为value的值 name相同则互斥-->

                    男<input type="radio" name="genor" value="1">&nbsp;

                    女<input type="radio" name="genor" value="2">&nbsp;

                    未知<input type="radio" name="genor" value="3">&nbsp;

        <p>爱好</p>

                足球<input type="checkbox" name="fav" value="1">

                排球<input type="checkbox" name="fav" value="2">

                篮球<input type="checkbox" name="fav" value="3">

                羽毛球<input type="checkbox" name="fav" value="4">

        <p>技能</p>

                <!--checkbox为复选框 checked 表示默认被选中-->

                游泳<input type="checkbox" name="skill" value="1" checked="checked">

                写作<input type="checkbox" name="skill" value="2">

                运动<input type="checkbox" name="skill" value="3">

                学习<input type="checkbox" name="skill" value="4">

                <p>上传文件</p>

                <!--依赖form表单的一个属性 enctype="multipart/form-data"-->

                <input type="file" name="filename">

                <input type="reset" value="重置">

                <textarea name="mero">默认值放中间</textarea><!--多行文本输入-->

                <!--默认size为1

                multiple为多选

                optgroup

                selected指定默认值

                -->

                <select name="city" size="4" multiple="multiple">

                    <option value="1">江苏</option>

                    <option value="2">上海</option>

                    <option value="3" selected="selected">北京</option>

                    <option value="4">成都</option>

                </select>

                <br>

                <select name="city2">

                    <optgroup label="城市">

                        <option value="1">徐州</option>

                        <option value="2">宿迁</option>

                        <option value="3">南通</option>

                    </optgroup>

                </select>

            </div>

        <input type="submit",value="提交"/>

</form>

</body>

</html>

CSS之checkbox&radio&textarea&select的更多相关文章

  1. jquery 获取和设置 checkbox radio 和 select option的值?

    ============== 获取和设置 checkbox radio 和 select的值? === val()函数, 其名字就表达了 它的意思: 他就是＝ value 的简写! val就是valu ...

  2. css美化checkbox radio样式

    /*check,radio*/ input.check_txt[type='checkbox']{ display: none; } input.check_txt[type='checkbox'] ...

  3. css 绘制checkbox,radio

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  4. jquery的checkbox,radio,select等方法总结

    jquery的checkbox,radio,和select是jquery操作的一个难点和重点,很多前端新手对其了解不是很透彻.时间久了不用,我在写的时候有时也难免对某些操作支支吾吾,记不清楚,现在,对 ...

  5. struts2学习笔记之表单标签的详解:s:checkbox/radio/select/optiontransferselect/doubleselect/combobox

    struts2中的表单标签都是以s标签的方式定义的,同时,struts2为所有标签都提供了一个模板,C:\Users\180172\Desktop\struts2-core-2.2.1.1.jar\t ...

  6. html自定义checkbox、radio、select —— checkbox、radio篇

    前些日子,所在公司项目的UI做了大改,前端全部改用 Bootstrap 框架,Bootstrap的优缺点在此就不详述了,网上一大堆相关资料. 前端的设计就交给我和另一个同事[LV,大学同班同学,毕业后 ...

  7. easyui 》 radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中

    获取一组radio被选中项的值var item = $('input[@name=items][@checked]').val();获取select被选中项的文本var item = $(" ...

  8. checkbox radio select绑定

    index11.html <html><head> <title>checkbox radio select绑定</title> <script ...

  9. Jquery - Select 和 Checkbox 、Textarea的操作

    Checkbox //判断是否选中 if ($(this).is(':checked')) { alert("它处于选中状态"); } else { alert("它不处 ...

随机推荐

  1. vue中动态加载组件+开发者模式+JS参数值传递和引用传递

    今天写vue里面通过接口反参动态加载组件时候 跟着同学...学习到了 一.先说说vue 内置组件 component 的用法 component组件可以来专门用来进行组件的切换,使用is来绑定你的组件 ...

  2. 微信小程序的布局css样式

    微信小程序的布局css样式width: fit-content;font-size:20px;      /*设置文字字号*/color:red;           /*设置文字颜色*/font-w ...

  3. [poj P2482] Stars in Your Window

    [poj P2482] Stars in Your Window Time Limit: 1000MS  Memory Limit: 65536K Description Fleeting time ...

  4. vs2013打包安装程序

    安装扩展包Visual Studio Installer VS2013下默认是没有Visual Studio Installer的,需要安装对应的扩展包: 下载地址:VS2013安装向导扩展包下载 安 ...

  5. 《JavaScript Dom 编程艺术》读书笔记-第4章

    我的前端入门第一本书是<JavaScript Dom 编程艺术>,网上查找资料发现前端的入门推荐书籍最受好评的就是这本和<JavaScript 高级程序设计>了.之所以先选这本 ...

  6. 博弈论：寻找先手必胜策略——Grundy值

    选修了人工智能课程,老师布置了调研任务:Grundy,开始看了一些资料并没有看懂. 后来找到了一篇文,写的很棒,里面有好多博弈相关的问题与分析,分享出来给大家: http://endless.logd ...

  7. 通过pid杀死进程

    bool ****::KillProcess(DWORD pid) { // When the all operation fail this function terminate the " ...

  8. php优秀框架codeigniter学习系列——CI_Security类学习

    这篇文章主要介绍CI核心框架工具类CI_Security. 安全类包含了一些方法,用于安全的处理输入数据,帮助你创建一个安全的应用.以下选取类中的重点方法进行说明. __construct() 在构造 ...

  9. MySql5.7 Distinct与Order By同时使用报错的解决方案

    mysql5.7版本中,如果DISTINCT和order by一起使用将会报3065错误,sql语句无法执行.这是由于5.7版本语法比之前版本语法要求更加严格导致的. 解决方案: 1.vim /etc ...

  10. java基础（7）集合与泛型

    第一部分:Collection集合 1 collection集合概述 集合按照其存储结构可以分为两大类,分别是单列集合java.util.Collection和双列集合java.util.Map. C ...