HTML标签
- <!DOCTYPE html>声明为HTML5文档。
- <html>、</html>是文档的开始标记和结束的标记。是HTML页面的根元素,在它们之间是文档的头部(head)和主体(body)。
- <head>、</head>定义了HTML文档的开头部分。它们之间的内容不会在浏览器的文档窗口显示。包含了文档的元(meta)数据。
- <title>、</title>定义了网页标题,在浏览器标题栏显示。
- <body>、</body>之间的文本是可见的网页主体内容。
表格:table中
<table border="1" cellpadding="10" cellspacing="20">
属相统计: border--表格边框 cellpadding--内边距 cellspacing--外边距
width--像素,百分比 rowspan--单元格竖跨多少行 colspan--单元格行跨多少列
form表单:
表单用于向服务器传输数据,从而实现用户与Web服务器的交互
表单能够包含input系列标签,比如文本字段、复选框、单选框、提交按钮等等。
表单还可以包含textarea、select、fieldset和 label标签。
accept-charset 规定在被提交表单中使用的字符集(默认:页面字符集)
action 表示要向何处提交表单,后面跟的是个网址(URL) (提交页面)
auto complete 规定浏览器应该自动完成表单 (默认:开启)
enctype 提交数据编码的(默认:url-encoded) 上传文件必须用form-data
method 规定在提交表单时所用的HTTP方法(默认:GET)
name 规定识别表单的名称(对于DOM使用document.forms.name)
novalidate 规定浏览器不验证表单
target 规定action属性中地址的目标(默认:_self)
一.form 中input标签的使用:
当type=test时,输入窗口处输入的内容可见
=password时,输入窗口处输入内容被圆点代替
=date时,出现的是个选择日期的窗口
=email时,出现的是个输入邮箱号的窗口
=checkbox时,出现的是复选方框
=radio时,出现的时单选圆圈,需要用name=’相同内容’来进行关联
=button时,是个空白按钮,用value=’XX’来命名,它只是个单纯的按钮,提交不了
=submit时,才是真正的提交按钮,用value=’xx’,来命名
=reset时,默认是重置,重置当前form表单中所有已填写内容
=file 时, 出现的是个选择文件的按钮,可用来选择文件上传
所有的input框都必须有name属相,选择一类框还必须有value属相才可
复选和单选加入默认选择,只需在默认的那个input后加checked即可
账号密码框设置框内提醒在input后加入placeholder=’设置内容’即可
给input标签设置默认值用value,value=’自定义值’
input标签中属相说明:
name:表单提交时的“键”,注意和id的区别.没有这个后台是收不到数据的
当input标签是checkbox和radio, name是用来关联的,还必须有value才可
value:表单提交时对应项的值
type="button", "reset", "submit"时,为按钮上显示的文本年内容
type="text","password","hidden"时,为输入框的初始值
type="checkbox", "radio", "file",为输入相关联的值
checked:radio和checkbox默认被选中的项
readonly:text和password设置只读
disabled:所有input均适用
二.form中select标签的使用: (下拉选择框)
<select name="country" multiple> #后面这个moultiple是设置下拉多选的
<option value="010">中国</option>
<option value="020">印度</option>
select标签中的name是用来和option中的value来做配对的.
select中默认选中是在默认的那个option后加入selected,注意和复选单选处区分开
三.form中textarea 标签的使用:
这个标签就是用来设置个能盛放大段内容的文本框
<textarea name="" id="" cols="30" rows="10"> </textarea>
name就是字典的key cols和rows是这个文本框的列和行数,可自定义
四.label标签的使用:
label标签是用来将一端提示性的文本和input框建立关联,点击文本光标可自动跳转到input框里
小结1:BOBY标签中的常用标签分类:
1.独占一行的,块级标签:
h:标题标签 p:段落标签 div:无格式标签 hr:加横线标签 tr:表格中的行起
止标签 li:ul与ol无序有序标签中的行起止标签
2.在一行显示的,行内标签/内联标签:
a:超链接标签 span:无格式标签 img:插入图片标签
b/i/u/s 加粗,倾斜,下划线,删除标签
小结2:标签的嵌套注意事项: 1.尽量不要用内联标签包块级标签2.p标签不能套p标签
3.p标签不能嵌套div标签
input标签常用type有:text,password,email,date,checkbox,radio
button-->普通按钮-->通常用JS给它绑定事件
submit-->提交按钮-->默认提交form表单的数据
reset-->重置按钮-->清空form中的所有输入框,无法用value给这个赋值.
小结3:form表单提交数据的注意事项:
1.form标签必须把获取用户输入的标签包起来
2.form标签必须有action属相和method属相
3.form中的获取用户输入的标签必须要有name属相
ul无序列表中去除前面小黑点除了可在ul标签中加入type=none属相来去除,也可在cs的style对中用list-style-type: none来去除
=======================================================================
HTML标签之头部(head)内标签介绍:
1.meta类标签:
属性charset=’gbk’时,为该meta标签为指定编码格式用的.
属性name=’Description’时,content后是关于其网页内容的一个整体描述
属性name=’Keywords’时,content后是关于其网页的一些关键字,是给爬虫用的
属性http-equiv=’refresh’,content=’3;http://www..baidu.com’表示3秒后会自动跳转
到百度页面,content内3后如不跟网址,则表示每隔3秒会自动刷新当前网页.
2.非meta类标签:
title标签对内为显示在浏览器上网页标签内的东西
link标签内有rel=’shortcut icon’ href=’图片网址’ type=’image/x-icon’时,表示该link
标签是引入的title内的网站图标
标签内有rel="stylesheet" href="cs文件名"时,表示引入cs文件的装饰
script标签对内有src=’js文件名’时,表示引入JavaScript文件.
style标签对内是定义内部body样式用的
=====================================================================================
HTML标签之主体(body)内标签介绍:
1.a标签对为超链接标签,其中href属性对应点击跳转的链接;title属性对应鼠标移
动其上自动显示的提示文字;target=_blank属性表示以新的网页打开网址.
_self为在当前页面打开(默认的就是这个).
p标签对为段落标签;
2.img标签为自闭和标签,用法如下:
<img src=’图片路径或图片网址 ’ alt=’加载失败的描述’ title=’鼠标移上去的提示’>
hr加行线 br强制换行 div与span标签都是无格式标签,但div是块级.
3.ul无序标签 ol有序标签 这两个内部都是套用的li标签对
dl自定义标签对内套的是dt标签对和dd标签对,分别对应标题和内容.