表单:
<input type="text" name="" value="" size="显示字符数" maxlength="最多字符数" readonly="readonly只读" disabled="disabled"不可操作未激活 placeholder="Search W3School">

<input type="password" value="" size="">

<input type="radio" name="sex" value="男" checked="checked" id="man"><label for="man">男</label>&nbsp;
<input type="radio" name="sex" value="女" id="woman"><label form="woamn">女</label>...........name需要相同!!!!!!!

<select name="">
<option selected="" value=""></option>
<option value=""></option>
</select>

<optgroup label="">分组名称
<select name="" size="能够显示的行数" multipule="multiple"多选>
<option value=""></option>
</select>
</optgroup>

<input type="file" size="显示长度" name="">

表单外框
<fieldset></fieldset>
<lenged></lenged>为fieleset定义标题
<input type="reset|submit|button" name="" value="">
<input type="image" src="" name>
<input type="hidden" value="" name="">

<textarea name="" cols="每行几个字" rows="多少行"></textarea>
添加滚动条: <textarea style=“scrollbar:overflow” ></textarea>

水平滚动条
<body style="overflow-x:hidden">
没有垂直滚动条
<body style="overflow-y:hidden">
没有滚动条
<body style="overflow-x:hidden;overflow-y:hidden">或<body style="overflow:hidden">
2.设定多行文本框的滚动条
没有水平滚动条
< textarea style="overflow-x:hidden">< /textarea>
没有垂直滚动条
< textarea style="overflow-y:hidden">< /textarea>
没有滚动条
< textarea style="overflow-x:hidden;overflow-y:hidden">< /textarea>
或< textarea style="overflow:hidden">< /textarea>
3.设定窗口滚动条的颜色
设置窗口滚动条的颜色为红色<body style="scrollbar-base-color:red">
scrollbar-base-color设定的是基本色,一般情况下只需要设置这一个属性就可以达到改变滚动条颜色的目的。
加上一点特别的效果:
<body style="scrollbar-arrow-color:yellow;scrollbar-base-color:lightsalmon">
4.在样式表文件中定义好一个类,调用样式表。
<style>
.coolscrollbar{scrollbar-arrow-color:yellow;scrollbar-base-color:lightsalmon;}
</style>
这样调用:
< textarea class="coolscrollbar">< /textarea>
textarea颜色及边框设置:
< textarea style="border:red solid;border-width:1 1 1 1;color:#CCCCCC;">< /textarea>

overflow-x,overflow-y的可取值为:visible(默认取值),hidden,auto,scroll。

visible:始终不显示滚动条,文本区域的大小会根据内容的增加,自动增长,以显示全部内容。
scroll:不管文本区域里的内容有多少,始终显示滚动条。
hidden:始终不显示滚动条,内容超出层面的对象是不显示。
auto:如果内容在文本区域内可以全部显示,滚动条不显示,当内容无法全部显示时,内容被截断,加上滚动条显示
所有内容。
注】:style的overflow属性必须和width属性结合使用才能生效!

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>注册</title>
</head>
<body>
<table width="700" align="center">
<tr>
<td>
<form action="" name="" method="post">
<fieldset>
<legend>注册</legend>
<table border="1" cellpadding="10" cellspacing="1" width="600" align="center">
<colgroup bgcolor="green" span="1" align="center"></colgroup>
<colgroup bgcolor="yellow" align="center"></colgroup>
<tr>
<td>用户名:</td>
<td><input type="text" name="uesrname" value="" placeholder="用户名为中文" size="10" maxlength="15"></td>
</tr>
<tr>
<td>密码</td>
<td ><input type="password" namw="pwd1"></td>
</tr>
<tr>
<td>确认密码</td>
<td ><input type="password" name="pwd2"></td>
</tr>
<tr>
<td>年龄</td>
<td><input type="text" name="age" value="25"></td>
</tr>
<tr>
<td>性别</td>
<td>
<fieldset>
<legend>请选择性别</legend>
<input type="radio" name="sex" value="男" checked="checked" id="man"><label for="man">男</label>&nbsp;
<input type="radio" name="sex" value="女" id="woman"><label form="woamn">女</label>
</fieldset>
</td>
</tr>
<tr>
<td>城市</td>
<td>
<select name="citys">
<option value="北京" checked="checked">北京</option>
<option value="上海">上海</option>
<option value="常州" >江苏</option>
</select>
</td>
</tr>
<tr>
<td>城市中的地区</td>
<td>
<select name="citys">
<optgroup label="常州">
<option value="武进区">武进区</option>
<option value="钟楼区">钟楼区</option>
<option value="新北区">新北区</option>
<option value="天宁区">天宁区</option>
</optgroup>
<optgroup label="上海">
<option value="武进区">武进区</option>
<option value="钟楼区">钟楼区</option>
<option value="新北区">新北区</option>
<option value="天宁区">天宁区</option>
</optgroup>
</select>
</td>
</tr>
<tr>
<td>交友目的</td>
<td>
<select name="target" size="3" multiple="multiple">
<option value="">普通朋友</option>
<option value="">对象</option>
<option value="">一般朋友</option>
</select>
</td>
</tr>
<tr>
<td>爱好</td>
<td>
<input type="checkbox" name="hobby" value="" id="yisu"><label form="yisu">艺术</label>
<input type="checkbox" name="hobby" value="" id="yinyue"><label form="yinyue">音乐</label>
<input type="checkbox" name="hobby" value="" id="yinyue">唱歌
</td>
</tr>
<tr>
<td>图片上传</td>
<td>
<input type="file" name="">
</td>
</tr>
<tr>
<td>自我介绍</td>
<td>
<textarea name="" rows="6" cols="15"></textarea>
</td>
</tr>
<tr>
<td><input type="hidden" name=""></td>
</tr>
<tr>
<td colspan="2" bgcolor="white">
<input type="submit" value="注册" name="">
<input type="reset" name="" value="重置">
<input type="button" name="" value="普通按钮">
</td>
</tr>
</table>
</fieldset>
</form>
</td>
</tr>
</table>
</body>
</html>

HTML表单相关的更多相关文章

  1. 表单相关标签之input标签

    用于搜集用户信息. <input type="text" name="fname" /> 标签属性 type 规定 input 元素的类型.输入字段 ...

  2. form表单相关

    <input> 元素 <input> 元素是最重要的表单元素. <input> 元素有很多形态,根据不同的 type 属性. 这是本章中使用的类型: 类型 描述 t ...

  3. angular4 Form表单相关

    ng4中,有两种方式去声明一个表单 一:Template-Driven Forms - 模板驱动式表单   [引入FormsModule] 1.ngForm赋值 [可以方便的获取表单的值] <f ...

  4. asp.net mvc 表单相关

    1. <form action="/controller/action" method="post"> ... </form> *act ...

  5. PhpForm表单相关的超全局变量操作

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. 表单相关标签之form标签

    表单能够包含 input 元素,比如文本字段.复选框.单选框.提交按钮等等. 表单还可以包含 menus.textarea.fieldset.legend 和 label 元素以及其它块级元素 表单用 ...

  7. html表单相关标签及属性

    1.<form>标签 定义整体的表单区域 action属性 定义表单数据提交地址 method属性 定义表单提交的方式,一般有“get”方式和“post”方式 2.<label> ...

  8. 微信小程序相关二、css介绍,菜单制作,表单相关,京东注册页面

    一.第二天上午 1.1上午因为有其他的课所以没有去这个课,不过下午看复习的时候的概括,讲了DTD,语法特性,css选择器以及权重,还有一些简单的样式 1.2 DTD Docuement Type 声明 ...

  9. HTML 5 表单相关元素和属性

    HTML使用表单向服务器提交请求,表单.表单控件的主要作用是收集用户输入,当用户提交表单时,用户输入内容将被作为请求参数提交到远程服务器.因此,在Web编程中,表单主要是用于收集用户输入的数据,在需要 ...

随机推荐

  1. java连接SqlServer2012

    要用java连接数据库  首先是要通过JDBC驱动 要先去下载一个sqljdbc4.jar,我这里放百度云盘了, 下载地址:链接:http://pan.baidu.com/s/1slJl89B 密码: ...

  2. appium+python 存在多个类时,不用每次都初始化解决办法

    appium+python写自动化测试用例时,为了代码的可维护性,分成不同的类是很常见的办法, 但是在运行时,每一个类都要初始化一次,即每次都会重启应用,这很麻烦,通过__new__可进行多个类之间的 ...

  3. PHP反序列化漏洞新攻击面(BlackHat 2018)

    0x00 前言   入职以来好久没有写过文章了,入职的时间里也和师傅们学到了很多,认识了很多的新朋友.最近因为BlackHat 黑客大会的一个议题,PHP反序列化漏洞利用被挖掘出新的攻击面.这里本着记 ...

  4. Java简易撞鬼游戏demo

    9*9方格内两点随机行走,相遇则停止. public class 撞鬼 { public static int length = 9; public static char[][] matrix = ...

  5. Cinderella

    Chapter 1 Ella, Ella, CinderellaThere is a beauiful girl. Her name is Ella.She lives with a wicked s ...

  6. 终于解决了贴吧手机版的一个重大BUG

    终于解决了贴吧手机版的一个重大BUG 别诧异虽然同一个域名,但是,PC 和手机打开完全不一样的体验 http://tieba.yunxunmi.com/ 吃点夜校准备做梦去!! 发现 我云贴吧 一个  ...

  7. linux 创建软链接和硬链接

    Linux 系统中有软链接和硬链接两种特殊的“文件”. 软链接可以看作是Windows中的快捷方式,可以让你快速链接到目标档案或目录. 硬链接则透过文件系统的inode来产生新档名,而不是产生新档案. ...

  8. WPF中Popup等弹窗的位置不对(偏左或者偏右)

    1.情况如图: 正常情况:         部分特殊情况: 在一般的电脑都能正确显示,就是第一种情况,同样的代码为什么在不同的电脑就会显示不同的位置呢,原来Windows为了满足 不同需求的用户,左撇 ...

  9. redis数据类型(三)hash类型

    一.hash类型   hash是一个string类型的field和value的映射表.添加,删除操作都是O(1)(平均).   hash特别适合用于存储对象.相对于将对象的每个字段存成单个string ...

  10. CC2530zigbee技术-简介协议栈

    前言 说实话,我喜欢自己的原创,虽然我写得可能简单了,但我觉得自己在写博客的路途上,一点一点地积累知识,我也借鉴别人的东西,特别是在写这篇文章时所使用的是markdownpad2写的,原来我根本就不知 ...