HTML

HTML：（Hype Text Markup Language）超文本标记语言，是最基本的网页语言。代码由标签组成，不区分大小写。

由<html>开始，</html>结束，分头部分（head）和体部分（body），头部分用于给页面增加一些辅助或属性信息，最先加载。体部分是真正存放页面数据的地方。

属性和属性值用“=”连接，属性值可加双引号、单引号或不加引号。

标签相当于一个容器，数据存放在容器里，对数据操作，就是在修改容器的属性值。

字体标签：<font size=”5” color=”red”>文字</font>

color属性可用颜色单词，也可用“#FFFFFF”：井号加十六进制数据表示，红绿蓝

标题标签：<h1>文字</h1>  共有6级标题

水平线标签：<hr color=”red” size=”5”/>   size属性指定水平线粗细

特殊符号：

大于号＞

小于号＜

与符号&

双引号”

空格

注册符®

版权符©

TM符™

&lt;

&gt;

&amp;

&quot;

&nbsp;

&reg;

&copy;

&trade;

列表和项目符号标签：

定义列表<dl> </dl>

数字标签<ol> </ol>

符号标签<ul> </ul>

<dl>定义列表DefinedList

<dt>定义项目

<dd>具体项目</dd>

<dd>具体项目</dd>

</dt>

</dl>

自动缩进效果

具体项目内容用<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设计视图，在属性中选择热点区域形状并在图像上拖动出一块热点区域，用热点区域链接某个资源。在页面中点击热点区域就会跳转到相应资源。

表格标签：<table><tr><td></td></tr></table>

<table border=”边框粗细” bordercolor  cellpadding=”单元格中数据与单元格边框间距” cellspacing=”单元格与单元格间距 0两线并为一线” width=’固定像素值或相对页面百分比’>            cellspacing=0两线并成一线但显示出来粗，用CSS中border-collapse两线重叠看起来就是一条线

<table>标签内<caption></caption>给表格加标题，是表格的一部分

<td colspan=2>行占两列

<td rowspan=2>列占两行 第一行第一个单元格

第一行第二个

第二行只有一个

table标签中默认都有一个tbody标签    thead、tbody、tfoot

浏览页面时，浏览器解析由table标签封装的页面数据时，读到</table>表格结束标记才会显示数据，若封装页面数据的表格很大，没读到结束标记就不显示任何数据，用户体验不佳，所以将表格分为多个部分，读一个</tbody>就显示一部分。用tbody将表格分体

超链接标签：<a href=”http://www.xxx.cn” >文字</a>

点击一个超链接做了什么？首先启动相应的协议解析引擎，访问本机hosts文件，查找对应主机IP，未找到再请求网络DNS服务器获取对应IP，用IP访问指定主机。

href属性，可以指定协议，mailto:abc@qq.com?subject=”邮件主题”&cc=”抄送地址”

mailto     thunder……   不指定协议默认启动文件协议解析

href=www.baidu.com    默认使用file协议打开的是一个本地文件 并不是主机地址

超链接实现页面内跳转：定位标记、锚

<a name=”top”>顶部位置</a>

用a标签的name属性为当前位置指定一个名字，不使用href属性

…很多页面内容…

在适当位置用a标签链接到指定名字的位置  用#标示当前页面

<a href=”#top”>回到顶部位置</a>

target属性指定页面打开方式，默认在当前页面内打开，_blank新窗口打开

title属性：当鼠标悬停在文字上时显示的文字内容

表单标签：用于与服务端交互

<form action=”表单提交目的地” method=”表单提交方式”></form>

form标签内的组件：input接收用户输入数据 select下拉列表 textarea文本区域

<input type=”text” name=”user” value=”zhangsan” />

input标签内要指定name属性，服务端才能获取到对应的value

input内包含的组件类型 通过type指定：

text文本框     password密码框

radio单选框          属于同一组的选择框name属性要一致，不然单选框不能实现单选

checkbox复选框    分组 同单选框     单选框不加属性时还不让你选

file  提供一个文件浏览按钮，多用于上传文件

hidden     隐藏组件，不需用户看到但服务端要用到，可通过JavaScript将其值在用户端运算后再提交至服务端使用

button     按钮 通过onclick方法添加事件监听

reset        重置按钮       submit     提交按钮

image      和submit一样，但可通过src属性指定一个图片充当按钮 美化效果

<select>选择列表，默认单选下拉式  设定multiple属性使选项全部列出，无下拉效果

size属性指定显示多少项，显示不完出现滚动条

通过<option></option>标签封装列表项

<textarea cols=”” rows=””>   文本区域 可指定行数和列数

<fieleset>区域设置，可给form加外框      外框上的文字可用legend标签指定

form中的method指定提交方式，有7中，常用get和post

用Java自定义服务端与form交互  查看数据提交不同之处

get提交：信息显示在地址栏中，敏感信息泄露，不安全；

地址栏存储信息量有限，不利于大数据量提交；

将信息封装在消息头前边；

提交至服务端的中文乱码需要再次编码后再解码

post：地址栏上不显示提交的信息，避免信息泄露，安全；

提交数据量无限制，方便大数据提交；

将信息封装在消息头后边（空行后）的数据体中；

中文乱码可通过设定字符集方法简单搞定

Tomcat服务端默认使用的iso8859编码，两种提交方式提交中文时，服务端会显示乱码，需要在服务端使用指定字符集解码，request.setCharacterEncoding(“GBK”)但设定字符集方法只对数据体中的数据有效，get方式提交的信息封装在消息头中，不能使用这种方法。但可以通过先用iso8859编码再GBK解码的方式解决。推荐使用post方式提交。

暴力提交、暴力注册

<a href=”http://注册地址?name=value&id=value......”>暴力开始</a>

超链接默认就是get方式提交

客户端首先进行数据有效性校验，服务端对客户端提交的数据必须再次校验

label标签：用于给各元素定义快捷键

for属性指定快捷键起作用的表单元素，其值必须与该表单元素的id值相同

accessKey指定快捷键，要与Alt合用

例：<label for=”user” accessKey=”u”>user name</label>

<input type=”text” id=”user” />

label使用技巧：

将label标签加到tr标签上，for属性指向该tr里的文本框，在这行的任意位置点击鼠标，文本框都将获得焦点。

其他标签：

<pre></pre>此标签内封装的文本数据格式将保持原样，包括空格和缩进等格式。常用于页面中显示带有缩进层次的代码。

<p></p>段落标签，两个段落之间带有空行

<b>加粗 <strong>加粗 <i>斜体 <u>下划线 <sub>下标 <sup>上标

<marquee direction=”left/right/down/up” behavior=”scroll/alternate/slide”>

此标签内可以让内容动起来，scroll滚动穿过/alternate来回弹/slide一下摔死

框架集frameset标签：将浏览器页面分成多个独立的部分，分别显示不同的页面

放在head和body之间  frameset分割页面 frame指定小页面内容

<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画中画标签：直接在当前页面中挖出一个区域，显示指定页面内容

<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指定打开方式

meta：    <meta name=”keywords” content=”电影，视频，关键字……” />

<meta http-equiv=”refresh” content=”3, url=http://www.xxx.com” />

http-equiv：模拟HTTP协议响应消息头，3秒后刷新，打开指定网页

link：给HTML关联一些文件，如CSS，JS等

<link rel=”stylesheet” href=”1.css” media=”print/screen”>

rel指定关联文件与HTML的关系 media指定文件作用的设备，多个设备斜杠分隔

XHTML是可扩展的（Extensible）超文本标记语言，可理解为HTML向XML的过渡。

XML是可扩展标记语言，是对数据信息的描述，而HTML是对数据显示的描述。XML规定更为严格，如标签不结束即错误。XML规范可被更多应用程序解释，将成为一种通用的数据交换语言，各个服务器、框架都将XML作为配置文件。

Dreamweaver创建HTML文件自动生成的头部信息中，又一个规范约束文件（.dtd），描述一些标签信息，由此文件来约束标签的自动闭合，删除这些头部信息后，DW中输入标签将不会自动闭合。前边的网址并不代表此文件要从网络获取，只表示名称空间，可自定义。

HTML知识点摘记的更多相关文章

  1. J2SE知识点摘记(六)

    1.        static关键字的使用 static 关键字:可以用于修饰属性,也可以用于修饰方法,还可以用于修饰类. static 修饰属性:无论一个类生成了多少个对象,所有这些对象共同使用唯 ...

  2. J2SE知识点摘记(五)

    1.        引用数据类型的传递 java用引用代替C++中的指针 fun()方法接收的参数是是Change c1,也就是说说fun()方法接受的是一个对象的引用,所以fun方法中所所做的操作就 ...

  3. J2SE知识点摘记(四)

    1.        抽象类(abstract) 抽象类和抽象方法都必须用abstract关键字来修饰. 抽象类不能被直接实例化,也就是不能直接用new关键字去产生对象. 抽象方法只需声明,而不需实现. ...

  4. J2SE知识点摘记(三)

    1.         在java只允许单继承,而不允许多重继承,也就是说一个子类只能有一个父类.但在java中却允许多层继承. 2.         非内部Class只能被public或者defaul ...

  5. J2SE知识点摘记(二)

    1.    对象的声明 "类名 对象名 = new 类名();"例子:Person P;//先声明一个Person类的对象p p=new Person();//用new关键字实例化 ...

  6. J2SE知识点摘记(一)

    1.        数组的声明时无法指定数组的长度. 2.        一维数组的声明和内存的分配 "数据类型    数组名[]; //声明一维数组     数组名=  new 数据类型[ ...

  7. JS知识点摘记(一)

    JavaScript:基于对象和事件的脚本语言 特点: 安全性:不允许直接访问本地硬盘,可做的就是信息的动态交互 跨平台性:只要可以解析JS的浏览器就可执行,与平台无关 JavaScript与Java ...

  8. CSS知识点摘记

    CSS层叠样式表cascading style sheets 将网页中的样式单独分离出来,完全由CSS控制,增强样式复用性和扩展性. 格式:选择器{属性名:属性值:属性名:属性值:……} CSS与HT ...

  9. J2SE知识点摘记-数据库(二)

    一.          查询数据 注意sql的内容. 通过ResultSet接口保存全部的查询结果,通过Statement接口中的executeQuery()方法查询.查询之后需要分别取出.通过nex ...

随机推荐

  1. Hive进阶(下)

    Hive进阶(下) Hive进阶(下) Hive的表连接 等值连接 查询员工信息:员工号.姓名.月薪.部门名称 1.select e.empno,e.ename,e.sal,d.dname2.from ...

  2. 在mysql 中两种锁定问题

    mysql 中15.2.10.5 中描述了两个问题,且分别给出了解决办法. 1.向子表中写入数据,但写入之前需确保父表中存在其相应信息. 可能出现,在已经读取父表中的数据,但另一请求将其删除. 办法: ...

  3. [linux]segvcatch简单使用

    https://code.google.com/p/segvcatch/ This is a crossplatform C++ library designed to convert a hardw ...

  4. WCF 启用multipleSiteBindingsEnabled 情况下报终结点地址错误

    报错信息如下: Server Error in '/MyWcfService' Application. When 'system.serviceModel/serviceHostingEnviron ...

  5. Mysql 关键字-保留字（转帖）

    2008-02-01 10:51 ADD ALL ALTER ANALYZE AND AS ASC ASENSITIVE BEFORE BETWEEN BIGINT BINARY BLOB BOTH ...

  6. yum localinstall rpm

  7. puppet svn集成

    puppet svn集成

  8. Facebook有两名重要经理离职 有一位将加入阿里

    据报道,Facebook将有两名重要经理离职,分别是领导视频广告产品的产品经理和企业沟通团队经理. 这是该仍在迅速增长的公司最新的人员离职情况.Facebook计划今年大幅扩张人员规模. 知情人士称, ...

  9. win下vm10+mac os 10.9安装遇到问题

    在windows 8下安装vm10.0.0+mac os 10.9遇到问题记录例如以下: 一.因为之前我装的vm9+mac os 10.7: 二.准备安装mac os 10.9,把vm9换成vm10: ...

  10. POJ3253 Fence Repair(贪心)

    分割木板的顺序是自由的,所以每次选择两块最短的板,组合在一起,增加队列,原来两个板出队,直到队列中为空或者仅仅剩下一个板时结束.这里使用优先队列较为方便. #include<iostream&g ...