黑马程序员_毕老师_HTML_32
来源:互联网 发布:日本研究生知乎 编辑:程序博客网 时间:2024/05/04 10:35
-------android培训、java培训、期待与您交流! ----------
HTML
- HTML:(Hype Text Markup Language)超文本标记语言,是最基本的网页语言。代码由标签组成(<>代表标签),不区分大小写。
- 由<html>开始,</html>结束,分头部分(head)和体部分(body),头部分用于给页面增加一些辅助或属性信息,最先加载。体部分是真正存放页面数据的地方。
- 属性和属性值用“=”连接,属性值可加双引号、单引号或不加引号,有什么区别呢,双引号比较规范(或者用公司规定书写规范,如标签名要大写,属性名小写,属性值必须用双引号来引。标签前面的缩进是用一个空格或者用两个空格,而不用tab。两个空格和四个空格有区别,按流量来走的话,就有严重的区别,字节大小不一样)。如果没有是不确定的数据的话,双引号里面可以嵌套单引号。
- 多数标签都是有开始标签和结束标签,其中有个别标签因为只有单一功能,或者没有要修饰的内容可以在标签内结束。如,<br/>。在后期的规范当中,规定所有的标签都必须的闭合。(要么你写一个结束的标签,要么在标签内部闭合)
- 想要对被标签修饰的内容进行更丰富的操作,就用到了标签中的属性,通过对属性值的改变,增加了更多的效果选择。
- 操作思想:
为了操作数据,都需要对数据进行不同标签的封装,通过标签中的属性对封闭的数据进行操作。标签相当于一个容器,数据存放在容器里,对数据操作,就是在修改容器的属性值。
字体标签:<font size=”5” color=”red”>文字</font>
- color属性可用颜色单词,也可用“#FFFFFF”:用井号加6个十六进制数据表示(表示一种复杂的颜色),两个代表一个颜色(可#是用于为了区分,它不是一个单词),从前到后分别是红绿蓝。可以运用工具来选取颜色。
标题标签:<h1>文字</h1> 共有6级标题
- 因为标题是文本中常用的内容,为了方便操作而定义的。其实就是某个字号和粗体的组合。
水平线标签:<hr color=”red” size=”5”/>size属性指定水平线粗细
特殊符号:
- < > &,这些符号在代码中会被浏览器识别并解释,所以用一些特殊的方式来表示。
可以运用Dreamweaver中的联想功能。当按下</的时候,结束标签自动补全。大于号>
小于号<
与符号&
双引号”
空格
注册符®
版权符©
TM符™
<
>
&
"
®
©
™
列表和列表中项目符号标签:
定义列表<dl> </dl>
数字标签<ol> </ol>
符号标签<ul> </ul>
<dl>定义列表DefinedList
<dt>定义项目
<dd>具体项目</dd>
<dd>具体项目</dd>
</dt>
</dl>
dd有自动缩进效果
具体项目内容用<li></li>封装 自动缩进
默认数字样式 可用type修改:a A I i 1
Start属性指定起始号码
默认样式空心圆circle
disc实心圆 square黑方块
可用CSS自定义符号
注释标签:<!—注释内容-->
图像标签:<img src=”../dir/file” alt=”说明文字” height width border/>
- src属性中在表示相对路径的时候,可用两个点(../)代表上层目录
- alt属性中的说明文字在鼠标悬停和图片加载失败时显示
- 图像地图:用<img>封装好图像后,切换到DW设计视图,在属性中选择热点区域形状并在图像上拖动出一块热点区域,用热点区域链接某个资源。在页面中点击热点区域就会跳转到相应资源。
- 如果想让浏览器显示的快一些的话,可以在浏览器中设置,工具->Internet选项->高级->去掉显示图片前面的勾。这个时候打开网页的时候,就不下载图片了,显示的图标不是叉,可以通过右键,将图片显示出来。如果想看图片的时候,因为有说明的文字,想看哪个将哪个显示出来就可以。
- 表格是由行所组成的,没有直接列的概念,行里面放的都是单元格。
- <table border=”边框粗细” bordercolor=“” cellpadding=”单元格中数据与单元格边框间距” cellspacing=”单元格与单元格间距 0两线并为一线” width=’固定像素值或相对页面百分比’>cellspacing=0两线并成一线但显示出来粗,用CSS中border-collapse两线重叠看起来就是一条线
- 如果在和个表格的第一行用<th>这个标签来表示的话,会居中,加粗。
- <table>标签内用<caption></caption>给表格加标题,使它成为表格的一部分
<td colspan=2>行占两列
<td rowspan=2>列占两行 第一行第一个单元格
第一行第二个
第二行只有一个
- 早期的时候设计网页的时候都是用一个大的布局将大的框架先给搭好,里面该有什么数据由服务端开始获取。
- 浏览页面时,浏览器解析由table标签封装的页面数据时,读到</table>表格结束标记才会显示数据,若封装页面数据的表格很大,没读到结束标记就不显示任何数据,用户体验不佳,所以将表格分为多个部分,读一个</tbody>就显示一部分。用tbody将表格分体。这样可以分行下载,下载多少就能显示多少,可以增强用户的体验效果。
- 表格都有一个默认的标签叫<tbody>,tbody的下面才有<tr>,<tr>的下面才有<tr>和<td>。只有理解和这个层次关系我们才能进行Dom编程。
- 每一个表格可以有一个表头、一个表尾和一个或多个表体(即正文),分别以THEAD、TFOOT和TBODY元素表示。THEAD、TFOOT包含关于表格列的信息。
超链接标签:<a href=”http://www.xxx.cn” >文字</a>
- 点击一个超链接做了什么?首先启动相应的协议解析引擎,访问本机hosts文件,查找对应主机IP,未找到再请求网络DNS服务器获取对应IP,用IP访问指定主机。
- href属性,可以指定协议,mailto:abc@qq.com?subject=”邮件主题”&cc=”抄送地址”
- <a href="thunder://dkdkdkdk">用迅雷打开</a>,因为这具是迅雷的资源,别人解析不了,所以只要一点这个链接,就打开迅雷这个软件,因为只要你安装的有迅雷这个软件,它就在本机注册过了。
- 如果href这个属性中没有协议,如http,它默认走的是文件的引擎,找文件,而不是找网址等。(如:href=www.baidu.com默认使用file协议,打开的是一个本地文件 并不是主机地址超链接)
- 用a标签的name属性为当前位置指定一个名字,不使用href属性
…很多页面内容…
- 在适当位置用a标签链接到指定名字的位置 用#标示当前页面
<a href=”#top”>回到顶部位置</a>target属性指定页面打开方式,默认在当前页面内打开,_blank新窗口打开
在用了#号后,找的就不是文件了,而是在本页面内找一个定义过的标记位置。
title属性:当鼠标悬停在文字上时显示的文字内容
- <a href="www.baidu.com"><img src="7.jpg" /></a>
网络上的一个现象,当我们去下载东西的时候,真正下载东西的链接很小,但是有其它的一些有下载链接的字样很大。会让我们误下载东西,要学会辨别,将光标放上去之后,关键是要看状态栏。还可以将小手向边上移,如果移到边上后,还是一个小手,那这个东西是一张图片,那可能就不是超链接。
表单标签:用于与服务端交互
- 我们必须为表单中的组件,定义出name和value这两个属性。name是方便服务器,来获取客户端提交的数据的。在text中value的值可以不用设置,如果设置的话,作为默认显示在文本框中的值。
- <form action=”表单提交目的地” method=”表单提交方式”></form>
- <input type=”text” name=”user” value=”zhangsan” />
input内包含的组件类型 通过type指定:
- text文本框 password密码框
radio单选框属于同一组的选择框name属性要一致,不然单选框不能实现单选
checkbox复选框 分组 同单选框单选框不加属性时还不让你选
file 提供一个文件浏览按钮,多用于上传文件
hidden 隐藏组件,不需用户看到但服务端要用到,可以把它封闭在hidden里面。hidden里面的value值都可以通过java给算出来。可通过JavaScript将其值在用户端运算后再提交至服务端使用
button 按钮 通过onclick方法添加事件监听
reset 重置按钮submit提交按钮
image 和submit一样,但可通过src属性指定一个图片充当提交按钮,可用于美化效果。
- <select>选择列表,默认单选下拉式设定multiple属性使选项全部列出,无下拉效果
通过<option></option>标签封装列表项
- <textarea cols=”” rows=””>文本区域 可指定行数和列数
- <fileset>区域设置,可给form加外框外框上的文字可用legend标签指定
- 如果你的页面只需要用到一引起下拉菜单,或者按钮,或者文本框,而不需要和服务器端进行交互的话,没有必要写form。form中的action属性可以指向一个网络的地址
- form中的method指定提交方式,有7中,常用get和post
get提交:信息显示在地址栏中,敏感信息泄露,不安全;
地址栏存储信息量有限(对IE来讲,它只能存到2083),不利于大数据量提交;将信息封装在消息头前边;提交至服务端的中文乱码需要再次编码后再解码
post提交:地址栏上不显示提交的信息,避免信息泄露,安全;
提交数据量无限制,方便大数据提交;将信息封装在消息头后边(空行后)的数据体中;
中文乱码可通过设定字符集方法(setCharacterEncoding())简单搞定。
Tomcat服务端默认使用的iso8859编码,两种提交方式提交中文时,服务端会显示乱码,需要在服务端使用指定字符集解码,request.setCharacterEncoding(“GBK”)但设定字符集方法只对数据体中的数据有效,get方式提交的信息封装在消息头中,不能使用这种方法。因为数据在发到服务器端的时候,用iso8859解码了,所以可以通过先用iso8859编码再GBK解码的方式解决。推荐使用post方式提交(一、避免敏感信息,二、解码的时候很方便,一个方法搞定)。
- 暴力提交、暴力注册
<a href=”http://注册地址?name=value&id=value......”>暴力开始</a>
超链接默认就是get方式提交(提交数据不仅只有from表单的形式,还有超链接,还可以地址栏中直接的提交)
客户端首先进行数据有效性校验,服务端对客户端提交的数据必须再次校验,用于提高数据的安全性。否则的话,我随时都可以突破它的表单校验限制,我写一个超链接就可以将要注册的信息给提交过去了。两端都做校验,客户端做校验是为了提高用户的体验效果,如果只是服务器做检验,还要等服务器返回,时间会比较长,并且如果错两次以上客户就会离开网站了。服务器端做校验是为了提高安全性。
label标签:用于给各元素定义快捷键
- for属性:指定快捷键起作用的表单元素,其值必须与该表单元素的id值相同(id是用和来标识某一个组件的,通常要保证它的唯一性)
例:<label for=”user” accessKey=”u”>user name</label>
<input type=”text” id=”user” />
- label使用技巧:
将label标签加到tr标签上,for属性指向该tr里的文本框,在这行的任意位置点击鼠标,文本框都将获得焦点。
其他标签:pre标签、p标签、b标签、i标签、u标签、sub下标、sup上标、
- <pre></pre>此标签内封装的文本数据格式将保持原样,包括空格和缩进等格式。常用于页面中显示带有缩进层次的代码。
- <p></p>段落标签,两个段落之间带有空行
- <b>加粗 <strong>加粗 <i>斜体 <u>下划线 <sub>下标 <sup>上标
- <marquee direction=”left/right/down/up” behavior=”scroll/alternate/slide”>
此标签内可以让内容动起来,scroll滚动穿过/alternate来回弹/slide一下摔死
框架集frameset标签:
- 将浏览器页面分成多个独立的部分,分别显示不同的页面
<frameset rows=”30%, *” frameborder=”yes” border=”1” framespacing=”0”>
<frame src=”1.html” noresize=”noresize” />
<frame src=”2.html” noresize=”noresize” />
</frameset>
- frameset中用rows和cols属性指定分割页面大小区域,可用百分比也可用像素值
- frame中的noresize属性使框架页面大小不可随意改动
- frame中添加的超链接默认都是在当前框架页面内打开的,要让其在当前窗口中的其他框架页面中打开,需要将框架页面添加一个name属性,让超链接的target属性值等于这个框架页面的name属性即可
- <iframe src=”1.html” width=30 height=50>画中画标签说明文字,这些文字在浏览器不支持iframe标签时显示</iframe>
画中画标签具有一定的危险性,可能被用于隐藏执行一些恶意的代码
如:<iframe src=”1.js” height=0 width=0>
头标签<head>内的一些标签:<title></title> <base /><meta /><link />
- title:页面标题,显示在浏览器标题栏上的文字
- base:href指定页面中所有超链接的目录,可本地,也可网络,结尾一定要用斜杠/表示
目录,只作用于相对路径文件。target指定打开超链接方式(我们在做见面的升级的时候,一般不直接改动原来的目录,而是将原来的目录拷贝一份到别的目录下,再在base标签中的href属性中指定目录的地址即可)
- meta: <meta name=”keywords” content=”电影,视频,关键字……” />
http-equiv:模拟HTTP协议响应消息头,3秒后刷新,打开指定网页(如注册完成后,5秒自动跳转到首页,用的就是这个。如果没有指定刷新地址的话,会在本页面刷新,实现实时刷新)。
百度和谷歌在早期的时候,在爬页面之前,爬的都是meta标签中,凡是name为keywords里面的关键字。加的越多,访问的越高。
- link:给HTML关联一些文件,如CSS,JS等
rel指定关联文件与HTML的关系 media指定文件作用的设备,多个设备斜杠分隔
- XHTML是可扩展的(Extensible)超文本标记语言,可理解为HTML向XML的过渡。XHTML是w3c在2000年的时候,为了增加HTML推出来的,本来是想替代HTML,但是发现Internet上用HTML写的见面太多,未遂!可以理解为它是HTML一个升级版(HTML4.01)。XHTML的代码结构更为严谨,是基于XML的一种应用。
- XML是可扩展标记语言,是对数据信息的描述(已经通用化,专门做为配置文件存在),而HTML是对数据显示的描述。XML规定更为严格,如标签不结束即错误。XML规范可被更多应用程序解释,将成为一种通用的数据交换语言,各个服务器、框架都将XML作为配置文件。
- Dreamweaver创建HTML文件自动生成的头部信息中,又一个规范约束文件(.dtd),描述一些标签信息,由此文件来约束标签的自动闭合,删除这些头部信息后,DW中输入标签将不会自动闭合。前边的网址并不代表此文件要从网络获取,只表示名称空间,可自定义。
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!代表注释,DOCTYPE代表声明类型。<html >标签称为根标签,其他的都称为根标签上的支叉。PUBLIC是国际很多的规范制定的关键字,是大型的国际组织制定的。还要SYSTEM是小型的组织制定的规范。xhtml1-transitional.dtd是一个对标记性文档进行约束的文件。http://www.w3.org/TR/xhtml1/DTD/是一个网址,但是不需要上网,代表一个名称空间,xhtml1-transitional.dtd文件所属于这个名称空间。名称空间完全可以起一个其他的名字。
有必要将标签都定义在空间里面去吗?有必要。是为我们使用的标签是可以自定义的。HTML中有<table>,我定义的标签中也有<table>,会有冲突。但在HTML中<table>标签代表表格,而在我的<table>是代表桌子。为了区分加上空间<table xmlns=”www.huyouni.com” >
XHTML中标签是固定的就那么多标签,标签名是固定的。而XML标签名是可是自定义的。
正则表达式
- 正则表达式:是一种专门用来操作字符串的规则,通过一些符号来表示某些程序代码,简化对字符串的复杂操作,但可读性较差。(正则表达式,先封装成对象,再获取其Matcher匹配器对象,再进行匹配)
- 常见操作:匹配、获取/查找、切割、替换
获取(查找):Pattern+Matcher
Pattern p = Pattern.compile(regex);封装规则
Matcher m = p.matcher(String);关联字符串,获取对应匹配器
while (m.find())查找是否包含有指定规则的字符串
{
SOP(m.group());输出符合规则的内容
切割:String中的split()spilt(regex)实现复杂切割(连词、叠词)}
替换:replaceAll(regex, str);
示例:获取连续数字
String regex = “\\d{5,}”;5个以上的连续数字符合规则
Pattern p = Pattern.compile(regex);
Matcher m = p.matcher(String);
while (m.find())
{
String s = m.group();
SOP(s.replaceAll(regex, “#”));将符合规则的数据替换掉
}
- 网页爬虫:通过网络以及IO读取网页源文件,并通过规则获取网页中符合规则的数据。比如:mail爬虫。String mailreg = “[a-zA-Z0-9_]{6,12}@[a-zA-Z0-9]+(\\.[a-zA-Z]+)+”
- 正则表达式中组的含义:将部分进行封装以便征用。\\num反向引用指定组。
- 常用的一些正则符号:
?零次或一次* 零次或多次+ 一次或多次点.表示任意字符\d任意数字\w字母数字下划线
{n}正好n次 {n,}最少n次{n,m}最少n次,最多m次
- 注意转义斜杠\\表示一个斜杠
- 如果正则表达式写的比较复杂的话,必须经过测试,并且测试的比较全面,否则会出现问题。
- 下表是元字符及其在正则表达式上下文中的行为的一个完整列表:
字符
描述
\
将下一个字符标记为一个特殊字符、或一个原义字符、或一个 后向引用、或一个八进制转义符。例如,'n' 匹配字符 "n"。'\n' 匹配一个换行符。序列 '\\' 匹配 "\" 而 "\(" 则匹配 "("。
^
匹配输入字符串的开始位置。如果设置了 RegExp 对象的Multiline 属性,^ 也匹配 '\n' 或 '\r' 之后的位置。
$
匹配输入字符串的结束位置。如果设置了RegExp 对象的Multiline 属性,$ 也匹配 '\n' 或 '\r' 之前的位置。
*
匹配前面的子表达式零次或多次。例如,zo* 能匹配 "z" 以及 "zoo"。 * 等价于{0,}。
+
匹配前面的子表达式一次或多次。例如,'zo+' 能匹配 "zo" 以及 "zoo",但不能匹配 "z"。+ 等价于 {1,}。
?
匹配前面的子表达式零次或一次。例如,"do(es)?" 可以匹配 "do" 或 "does" 中的"do" 。? 等价于 {0,1}。
{n}
n 是一个非负整数。匹配确定的 n 次。例如,'o{2}' 不能匹配 "Bob" 中的 'o',但是能匹配 "food" 中的两个 o。
{n,}
n 是一个非负整数。至少匹配n 次。例如,'o{2,}' 不能匹配 "Bob" 中的 'o',但能匹配 "foooood" 中的所有 o。'o{1,}' 等价于 'o+'。'o{0,}' 则等价于 'o*'。
{n,m}
m 和 n 均为非负整数,其中n <=m。最少匹配 n 次且最多匹配 m 次。刘, "o{1,3}" 将匹配 "fooooood" 中的前三个 o。'o{0,1}' 等价于 'o?'。请注意在逗号和两个数之间不能有空格。
?
当该字符紧跟在任何一个其他限制符 (*, +, ?, {n}, {n,}, {n,m}) 后面时,匹配模式是非贪婪的。非贪婪模式尽可能少的匹配所搜索的字符串,而默认的贪婪模式则尽可能多的匹配所搜索的字符串。例如,对于字符串 "oooo",'o+?' 将匹配单个 "o",而 'o+' 将匹配所有 'o'。
.
匹配除 "\n" 之外的任何单个字符。要匹配包括 '\n' 在内的任何字符,请使用象 '[.\n]' 的模式。
(pattern)
匹配pattern 并获取这一匹配。所获取的匹配可以从产生的 Matches 集合得到,在VBScript 中使用SubMatches 集合,在JScript 中则使用$0…$9 属性。要匹配圆括号字符,请使用 '\(' 或 '\)'。
(?:pattern)
匹配 pattern 但不获取匹配结果,也就是说这是一个非获取匹配,不进行存储供以后使用。这在使用 "或" 字符 (|) 来组合一个模式的各个部分是很有用。例如, 'industr(?:y|ies) 就是一个比 'industry|industries' 更简略的表达式。
(?=pattern)
正向预查,在任何匹配 pattern 的字符串开始处匹配查找字符串。这是一个非获取匹配,也就是说,该匹配不需要获取供以后使用。例如, 'Windows (?=95|98|NT|2000)' 能匹配 "Windows 2000" 中的 "Windows" ,但不能匹配 "Windows 3.1" 中的 "Windows"。预查不消耗字符,也就是说,在一个匹配发生后,在最后一次匹配之后立即开始下一次匹配的搜索,而不是从包含预查的字符之后开始。
(?!pattern)
负向预查,在任何不匹配Negative lookahead matches the search string at any point where a string not matchingpattern 的字符串开始处匹配查找字符串。这是一个非获取匹配,也就是说,该匹配不需要获取供以后使用。例如'Windows (?!95|98|NT|2000)' 能匹配 "Windows 3.1" 中的 "Windows",但不能匹配 "Windows 2000" 中的 "Windows"。预查不消耗字符,也就是说,在一个匹配发生后,在最后一次匹配之后立即开始下一次匹配的搜索,而不是从包含预查的字符之后开始
x|y
匹配 x 或 y。例如,'z|food' 能匹配 "z" 或 "food"。'(z|f)ood' 则匹配 "zood" 或 "food"。
[xyz]
字符集合。匹配所包含的任意一个字符。例如, '[abc]' 可以匹配 "plain" 中的 'a'。
[^xyz]
负值字符集合。匹配未包含的任意字符。例如, '[^abc]' 可以匹配 "plain" 中的'p'。
[a-z]
字符范围。匹配指定范围内的任意字符。例如,'[a-z]' 可以匹配 'a' 到 'z' 范围内的任意小写字母字符。
[^a-z]
负值字符范围。匹配任何不在指定范围内的任意字符。例如,'[^a-z]' 可以匹配任何不在 'a' 到 'z' 范围内的任意字符。
\b
匹配一个单词边界,也就是指单词和空格间的位置。例如, 'er\b' 可以匹配"never" 中的 'er',但不能匹配 "verb" 中的 'er'。
\B
匹配非单词边界。'er\B' 能匹配 "verb" 中的 'er',但不能匹配 "never" 中的 'er'。
\cx
匹配由x指明的控制字符。例如, \cM 匹配一个 Control-M 或回车符。x 的值必须为 A-Z 或 a-z 之一。否则,将 c 视为一个原义的 'c' 字符。
\d
匹配一个数字字符。等价于 [0-9]。
\D
匹配一个非数字字符。等价于 [^0-9]。
\f
匹配一个换页符。等价于 \x0c 和 \cL。
\n
匹配一个换行符。等价于 \x0a 和 \cJ。
\r
匹配一个回车符。等价于 \x0d 和 \cM。
\s
匹配任何空白字符,包括空格、制表符、换页符等等。等价于 [ \f\n\r\t\v]。
\S
匹配任何非空白字符。等价于 [^ \f\n\r\t\v]。
\t
匹配一个制表符。等价于 \x09 和 \cI。
\v
匹配一个垂直制表符。等价于 \x0b 和 \cK。
\w
匹配包括下划线的任何单词字符。等价于'[A-Za-z0-9_]'。
\W
匹配任何非单词字符。等价于 '[^A-Za-z0-9_]'。
\xn
匹配 n,其中 n 为十六进制转义值。十六进制转义值必须为确定的两个数字长。例如, '\x41' 匹配 "A"。'\x041' 则等价于 '\x04' & "1"。正则表达式中可以使用 ASCII 编码。.
\num
匹配 num,其中 num 是一个正整数。对所获取的匹配的引用。例如,'(.)\1' 匹配两个连续的相同字符。
\n
标识一个八进制转义值或一个后向引用。如果 \n 之前至少n 个获取的子表达式,则 n 为后向引用。否则,如果n 为八进制数字 (0-7),则 n 为一个八进制转义值。
\nm
标识一个八进制转义值或一个后向引用。如果 \nm 之前至少有is preceded by at leastnm 个获取得子表达式,则 nm 为后向引用。如果 \nm 之前至少有 n 个获取,则 n 为一个后跟文字m 的后向引用。如果前面的条件都不满足,若 n 和 m 均为八进制数字 (0-7),则 \nm 将匹配八进制转义值nm。
\nml
如果 n 为八进制数字 (0-3),且 m 和l 均为八进制数字 (0-7),则匹配八进制转义值nml。
\un
匹配 n,其中 n 是一个用四个十六进制数字表示的 Unicode 字符。例如, \u00A9 匹配版权符号 (?)。
HTML回顾
html:超文本标记语言。
html语言中是由标签组成的。html中的数据都会封装在标签当中,因为台以通过标签中的属性值的改变对封装内数据进行操作。确定html代码范围。<html></html>。在该满园中可以定义两部分内容,一部分是头,一部分是体。
<html><head></head><body></body></html>
head:见面的一些属性信息。比如:标题
body:网页显示的数据。
标签特点:对于数据进行封装,那么就有开始标签和都会,但是也有一些标签只体现单一功能,所以不需要结束标签,规范中要求标签必须要结束,所以这样的标签在内部结束。如:
<br/><hr/><img/><input/>
标签格式:<标签名 属性名=“属性值”>数据</标签名>
<标签名 属性名=“属性值”>
创建标签:
字体:<font> 例:<font size=”7” color=”#ffff00”>数据</font>
特殊部分:如果要在页面显示一些特殊符号,需要进行转义。
<: < >: > &: & 空格:
标题:<h1><h2><h3>……<h6>
列表标签:<dl></dl>
上层项目:<dt> 下层项目:<dd>图像标签:<img>
项目符号标签:<ul><ol> 这两个标签中的列表项都由<li>标签封装
<img src=”” alt=”图像说明文字”>表格标签:<table>
表格由行所组成由单元格组成。表格中默认都有一个tbody标签。标题标签:<caption>
<table boder=”1” bordercolor=”red” width=”60%” cellpadding=”10” cellspacing=”0”>超链接:<a>
<tr>
<th></th>
<th></th>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
表格是最常用的标签,用于对数据进行格式化。
<a href=http://www.sina.com.cn >新浪网站</a>表单标签:
当被点南后,会启动引擎所对应解析程序。去想找指定主机。
1, 先找本机主机的hosts文件。如果没有找到该主机对应的ip地址
2, 去公网NDS服务器上找对应的ip地址。
<a href=milto:abc@sohu.com?subject=haha&cc=qq@163.com”>联系我们</a>
超链接的另一个作用:
定位标记:
<a name=”top”>一从此位置</a>
<a href=”#top”>获取那个位置</a>
该标签是可以和服务端进行交互的。
<from>
表单标签中元素:
<input>:该标签因为type属性的值的不同,所对应的组件也不一样。
type属性:
1,text:文本框,输入的文本可见。2,password:密码框,输入的文本不可见。3,radio:单选框,注意,要被选中,必须要给单选框定义一个属性name,当有多个单选框时,只能有一个被选中,那么这些单选框的name值必须相同。4,checkbox:复选框,当对多个数据进行同时选中时。5,file:可以进行文件选择的组件。通常用于附件,或者文件上传。6,hidden:隐藏组件,该组件不会在页面上显示,但是其定义的name和value可以提交到服务端。7,button:按钮组件,自定义按钮默认是没有任何效果的,可以通过注册事件并加入自定义效果。8,reset:重置按钮,将组件中被操作的效果还原到时初始状态。9,submit:提交按钮,将组件中添加的数据提交到指定的目的地。10,image图像组件,为了避免提交按钮的难看,可以通过image的src属性连接一个好看的按钮图片完成提交效果。
下拉菜单:<select>
每一个下拉菜单项都由option进行封装。
<select><option></option></select>
文本区域:<textarea>
表单组件通常都需要定义name和value属性,因为要将数据发送给服务端,服务端只有知道了该name的值才可以对提交的数据进行分别获取。
form标签中的常见的属性:action:指定数据提交的目的地。method:提交方式。两种常用值get和post。get为默认。get和post的区别:get:会将提交的数据显示在地址栏上。post:不会将数据显示在地址栏上。get:提交的数据的体积受地址栏的限制。post:可以提交大体积数据。get:对于第三信息不安全。post:对于第三信息安全。get:会将提交信息封装在请求行,也就是http消息头之前。post:会将提交信息封装在数据体中,也就是http消息头之后的空行后。对于服务端而言。表单提交尽量用post,因为涉及到编码问题。因为tomcat服务端默认的解码是ISO8859-1。对于post提交的中文。在服务端可以直接使用setChareacterEncodeing(“gbk”)就可以解决对于get提交的中文,在服务端只能通过ISO8859—将数据编码一次,在通过指定的码表如GBK解码。使用表单的组件不一定要定义form标签。只有需要将数据进行服务端的提交的时候才会用到form标签。
------- android培训、java培训、期待与您交流! ----------
- 黑马程序员_毕老师_HTML_32
- 黑马程序员_毕老师_CSS_JS(上)
- 黑马程序员_毕老师_CSS_JS(下)
- 黑马程序员_看张孝祥老师高新技术day01
- 黑马程序员_看毕老师视频第一天的小结之环境变量的设置
- 黑马程序员_第一次用思维导图做得java基础知识总结(毕向东+张孝祥老师)
- 黑马程序员_看张老师银行业务调度系统总结
- 黑马程序员_张孝祥老师的基础加强2
- 黑马程序员_张孝祥老师的交通灯面试题
- 黑马程序员_张孝祥老师的银行调度面试题
- 黑马程序员_张孝祥老师的基础加强1
- 黑马程序员_张孝祥老师的基础加强3
- 黑马程序员_张孝祥老师的基础加强4
- 黑马程序员_张孝祥老师全部知识点总结
- 黑马程序员_张老师的交通管理灯系统
- 黑马程序员--毕向东老师--API讲解
- 黑马程序员_java基础加强12_空中网题解_老师解答
- 黑马程序员_学习张孝祥老师《交通灯管理系统》、《银行业务调度系统》
- 杭电 1071 The area 题解报告
- canvas画布+form表单部分属性
- Java命名规范
- 网站重构——轻量化的网站架构设计一,使用nodejs sqlite3查询数据
- Yii: 获取URL的一些方法
- 黑马程序员_毕老师_HTML_32
- 黑马程序员-探究字节流二
- ASP.NET学习笔记(二)-Get,Post,Request区别
- vim快捷键映射
- [黑马程序员]多线程——锁
- <转> amazon的一个大牛谈各种语言 c c++ java python ruby lisp perl
- 黑马程序员-探究字节流三
- 解决问题E: 无法获得锁 /var/lib/dpkg/lock - open (11: 资源暂时不可用)
- hdu 4800 Josephina and RPG dp