day_10

每天一句: 如果你不能打败对手,那你就加入对手。
一、表单高级

表单字段集

语法:
<fieldset> </fieldset>
说明:
相当于一个方框,在字段集中可以包含文本和其他元素。该元素用于对表单中的元素进行分组并在文档中区别标出文本。fieldset元素可以嵌套,在其内部可以在设置多个fieldset对象;

字段级标题

语法:
<legend align="left/center/right/justify">个人信息</legend>
说明:
legend元素可以在fieldset对象绘制的方框内插入一个标题,legend元素必须是fieldset内的第一个元素;

上传文件框

语法:
<input type="file" multiple="multiple" />
说明:
type属性值新增的类型有: file文件类型,可进行文件的选择,multiple属性可实现多选;

required属性

语法:
<input type=“text” required=“required”/>
<input type=“text” required />
说明:
设置必填属性,即此项必填项;

二、表格属性

单元格间距(cellspacing)

语法:
border-spacing:value;
说明:
单元格间距(该属性必须给table添加),表示单元格边框之间的距离,不可取负值;

合并相邻单元格边框

语法:
border-collapse:separate/collapse;
说明:
合并相邻单元格边框(该属性必须给table添加);
separate(边框分开)默认值;
collapse(边框合并);

无内容时单元格的设置

语法:
empty-cells:show/hide;
说明:
定义当单元格无内容时,是否显示该单元格的边框;
show:显示;
hide:隐藏;
【不要使用border-collapse:collapse;否则无效】

显示单元、行和列的算法(加快运行的速度)

语法:
table-layout:auto/fixed; (默认是auto)
说明:
定义表格的布局算法,设置fixed,文本为英文字母且无空格时,内容超出单元格宽度则固定不变;如没设宽则平均分配;设置auto时,则随内容宽度而定;
fixed:固定宽,不会随内容多少改变单元格宽,宽度可以明确定义,没有定义时则宽度会平均分配,高度则会随内容变化;
auto自动表格布局: 优点(灵活)、缺点(较慢,因为要确定布局前要先访问表格中所有数据);
fixed固定表格布局: 优点(加快运行速度,允许浏览器更快的对表格进行布局)、缺点(不太灵活)

设置表格标题的位置

语法:
caption-side:top/right/bottom/left
说明:
定义表格的caption对象放于表格的哪个位置,与caption元素一起使用;
top为默认值;
left,right位置只有火狐识别;
top,bottom IE6以上版本支持,IE6以下版本不支持其它属性值,只识别top;

隔行变色设置

语法:
双数行: tr:nth-child(2n){ }
单数行: tr:nth-child(2n+1){ }
说明:
设置单数单元格的样式和双数单元格的样式

数据行分组

<thead></thead> 表头
<tbody></tbody> 表体
<tfoot></tfoot> 表尾
说明:一个Table中,只能包含一个thead,一个tfoot,但可包含多个tbody;

备注:
thead 元素应该与 tbody 和 tfoot 元素结合起来使用;
tbody 元素用于对 HTML 表格中的主体内容进行分组, tfoot 元素用于对 HTML 表格中的表注(页脚)内容进行分组;
如果要使用 thead、tfoot 以及 tbody 元素,就必须使用全部的元素;
它们的出现次序是:thead、tfoot、tbody,这样浏览器就可以在收到所有数据前呈现页脚了;

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 200,738评论 5 472
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 84,377评论 2 377
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 147,774评论 0 333
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,032评论 1 272
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,015评论 5 361
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,239评论 1 278
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,724评论 3 393
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,374评论 0 255
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,508评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,410评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,457评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,132评论 3 316
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,733评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,804评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,022评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,515评论 2 346
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,116评论 2 341

推荐阅读更多精彩内容

  • HTML 5 HTML5概述 因特网上的信息是以网页的形式展示给用户的,因此网页是网络信息传递的载体。网页文件是用...
    阿啊阿吖丁阅读 3,815评论 0 0
  • (注1:如果有问题欢迎留言探讨,一起学习!转载请注明出处,喜欢可以点个赞哦!)(注2:更多内容请查看我的目录。) ...
    love丁酥酥阅读 4,149评论 2 5
  • 每天一句: 如果你不能打败对手,那你就加入对手。一、表单高级 表单字段集 语法: 说明:相当于一个方框,在字段...
    陈small末阅读 382评论 0 1
  • 每天一句: 如果你不能打败对手,那你就加入对手。 一、表单高级 表单字段集 字段级标题 上传文件框 require...
    EndEvent阅读 674评论 0 0
  • 生命很有意思,同样是投胎做人,有人投胎到富庶美丽的欧洲美国,有人投胎到贫瘠战乱的动荡小国,有人投胎到富裕有...
    linlin_7eef阅读 406评论 0 5