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. ubuntu 开启 rewrite 模块

    1.sudo a2enmod rewrite 开启Rewrite模块 (停用模块,使用 a2dismod) 2. 在/etc/apache2/ 修改apache2.conf 文件中把AllowOver ...

  2. 关于css3的边框的border-radius和border-image用法的详解

      一.圆角边框:IE9.0以前版本不支持   border-radius: 接受8个属性,前四个为x轴,后四个为y轴,以斜杠划分x轴.y轴,即border-radius:左上较 右上角 右下角 左下 ...

  3. Android 自定义shape圆形按钮

    Shape的属性: solid 描述:内部填充 属性:android:color 填充颜色 size 描述:大小 属性: android:width 宽 android:height 高 gradie ...

  4. C# 堆栈的数据结构 (二)

    堆栈是一种常用的数据结构,并且是线性表操作的子集,即操作受限的线性表.因此需要用到Clist 线性表类 public class CStack { private Clist m_List;//创建链 ...

  5. Hot-Bar 軟板設計注意事項

    Hot-Bar reflow (熔錫熱壓焊接),其最只要功能,就是利用熱壓頭熔融已經印刷於電子印刷電路(PCB)上的錫膏,藉以連接兩個各自獨立的電子零件,最常見到的是將軟排線(FPB)焊接於電子印刷電 ...

  6. java的几个版本以及jre，jdk等概念——【转载】JDK、Java SE、Java EE、Java ME我该选

    我们平时使用的一些软件,有一部分需要Java环境的支持,但是SUN那么多的产品,让人眼花缭乱的版本号,前看后看都差不多的缩写,让我们选择起来的时候常常望而却步,只好跟着感觉走.所以下面我要介绍的就是那 ...

  7. php 多维数组　arrayList array()

    <pre name="code" class="php">$params=array( "tid"=>"3&qu ...

  8. 关于优化性能<主要是速度方面>的个人心得 【转】

    一个web项目后期的维护主要在于性能方面.数据吞吐量一旦增大各种bug都出来了.那些通过硬件<数据库分表,数据库主从分离,读写分离>等的一些手段此处就不多说了.本文主要在编码方面做一个性能 ...

  9. CSS中zoom和scale的区别

    zoom和scale这两个东西都是用于对元素的缩放,但两者除了兼容性之外还有一些不同的地方.zoom缩放会将元素保持在左上角,而scale默认是中间位置,可以通过transform-origin来设置 ...

  10. PHP与MySQL交互

    <?php $con = mysql_connect("localhost","root","12345"); $dbcharset ...