NO.54 表单、CSS基础

1.表单元素:用来声明表单的范围,只有此范围内填写的数据才能提交给服务器。

action:用来声明表单提交的目标。

例:<form action="http://www.baidu.com">

2.表单控件:用来让用户输入数据。

2.1 input元素

文本框

value:设置默认值

maxlength:设置最大长度

例:账号:<input type="text" value="smallnumber" maxlength="10" readonly/>

密码框

value:设置默认值

maxlength:设置最大长度

例:密码:<input type="password"/>

单选框

name:组名,同一组单选才能彼此互斥。

checked:设置默认选中。

例:性别:<input type="radio" name="sex" checked/>男<input type="radio" name="sex">女

多选框

checked:设置默认选中。

例:<input type="checkbox" checked>美食<input type="checkbox">旅游

隐藏框

例:<input type="hidden" value="message"/>

文件框

例:<input type="file"/>

提交、重置、普通按钮

例:<input type="submit" value="注册"/>

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

<input type="button" value="试试"/>

2.2 其他元素

label:用来管理表单中的文字,它可以将文字与控件绑定,从而增加控件的点击范围,提高易用性。

id是元素的唯一标识,任何元素都可以有id。

例:<input type="checkbox" id="c1"><label for="c1">我已阅读并自愿遵守此协议<!/label>

下拉选

selected:设置默认选中。

例:城市:<select>

<option>请选择</option>

<option selected>成都</option>

<option>深圳</option>

</select>

文本域

cols:设置宽度。

rows:设置高度。

例:简介:<textarea cols="30" rows="6"></textarea>


CSS的三种用法

1.内联样式:在元素的style属性内书写样式。

2.内部样式:在style标签内书写样式。

3.外部样式:在单独的css文件内书写样式。

CSS的规则特性

1)继承性:子元素可以继承父元素的样式(字体,颜色)。

2)层叠性:给一个元素增加不同的声明,效果会叠加。

3)优先级:给一个元素增加相同的声明,效果以后者为准。也叫就近原则(哪个样式离元素近就哪个生效)。

选择器

1)元素选择器:选择body、p、h1等等。

2)类选择器:选择class=某值的所有元素。

3)ID选择器:选择id=某值的唯一元素。

4)选择器组:可以选中一组选择器所对应目标的并集。

5)派生选择器:选择某元素的子孙----#p1 b    选择某元素的儿子-----#p2>b

6)伪类选择器:选择某状态之下的元素。

选择未访问过的超链接----a:link

选择已访问过的超链接----a:visited

选择激活态(正在点)的按钮----#b1:active

选择有焦点的文本框----#t1:focus

选择悬停态的图片----img:hover


边框问题

效果:

box模型

效果:

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

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,747评论 1 92
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,649评论 18 139
  • 介绍 这个教程,我认为最大的特色就是不用 Super WP Cache、W3TC 这里的插件来实现缓存,而是最大化...
    暖夏未眠丶阅读 926评论 0 1
  • 一战期间,美军每天有1万8千人因为染上性传播疾病而无法作战。在二战高峰期,每天因染上性病而无法作战的美军人数降到了...
    三道贩阅读 294评论 0 1
  • 在世界民族中,有一个民族,他为两次世界大战打上终上符! 在世界诗林中,有一个民族的诗歌如灿烂北斗,在世界文学史上熠...
    十国语言学习阅读 181评论 0 0