HTML知识点摘记
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符™ |
< |
> |
& |
" |
|
® |
© |
™ |
列表和项目符号标签:
定义列表<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知识点摘记的更多相关文章
- J2SE知识点摘记(六)
1. static关键字的使用 static 关键字:可以用于修饰属性,也可以用于修饰方法,还可以用于修饰类. static 修饰属性:无论一个类生成了多少个对象,所有这些对象共同使用唯 ...
- J2SE知识点摘记(五)
1. 引用数据类型的传递 java用引用代替C++中的指针 fun()方法接收的参数是是Change c1,也就是说说fun()方法接受的是一个对象的引用,所以fun方法中所所做的操作就 ...
- J2SE知识点摘记(四)
1. 抽象类(abstract) 抽象类和抽象方法都必须用abstract关键字来修饰. 抽象类不能被直接实例化,也就是不能直接用new关键字去产生对象. 抽象方法只需声明,而不需实现. ...
- J2SE知识点摘记(三)
1. 在java只允许单继承,而不允许多重继承,也就是说一个子类只能有一个父类.但在java中却允许多层继承. 2. 非内部Class只能被public或者defaul ...
- J2SE知识点摘记(二)
1. 对象的声明 "类名 对象名 = new 类名();"例子:Person P;//先声明一个Person类的对象p p=new Person();//用new关键字实例化 ...
- J2SE知识点摘记(一)
1. 数组的声明时无法指定数组的长度. 2. 一维数组的声明和内存的分配 "数据类型 数组名[]; //声明一维数组 数组名= new 数据类型[ ...
- JS知识点摘记(一)
JavaScript:基于对象和事件的脚本语言 特点: 安全性:不允许直接访问本地硬盘,可做的就是信息的动态交互 跨平台性:只要可以解析JS的浏览器就可执行,与平台无关 JavaScript与Java ...
- CSS知识点摘记
CSS层叠样式表cascading style sheets 将网页中的样式单独分离出来,完全由CSS控制,增强样式复用性和扩展性. 格式:选择器{属性名:属性值:属性名:属性值:……} CSS与HT ...
- J2SE知识点摘记-数据库(二)
一. 查询数据 注意sql的内容. 通过ResultSet接口保存全部的查询结果,通过Statement接口中的executeQuery()方法查询.查询之后需要分别取出.通过nex ...
随机推荐
- http://www.cnblogs.com/fczjuever/archive/2013/04/05/3000680.html
http://www.cnblogs.com/fczjuever/archive/2013/04/05/3000680.html
- Qt使用快捷键
在说快捷键之前先来说一个QtCreator调试的过程中经常发生的一个问题. 问题描述: 用QtCreator建立了一个纯C++的项目,但是在F5调试时,竟然提示ptrace不允许的操作,修改工程配置为 ...
- 【转】Perl Unicode全攻略
Perl Unicode全攻略 耐心看完本文,相信你今后在unicode处理上不会再有什么问题. 本文内容适用于perl 5.8及其以上版本. perl internal form 在Perl看来, ...
- [问题解决] /home目录占用率100%
今天发现一个比较奇怪的现象,linux系统下一个目录挂在存储下,df -Th 显示该目录使用率100%, du 该目录显示只用了2%, 后来发现是由于进程占用了被删掉的文件空间导致.举例如下: [ro ...
- svn常见问题汇总
has no ancestry information 经查,由于project/,01Dev/的权限被关闭了,把当前文件夹父目录(project/,01Dev/) 下的 .svn/ 目录删除就好了.
- 不要在公共接口中传递STL容器
最近的一个项目,是开发一个framework,提供给公司内部不同的产品线使用. 之间遇到的一个问题,就是STL容器的使用, 而结论是不要在公共接口中传递STL容器: 这里说的STL容器,但主要则是指容 ...
- Unity CCTween UGUI 动画插件
在这简单的介绍一下 CCTween 动画插件的使用 因为GIF 制作软件不太好(网上随便下载的)所以导致效果不太好,有时间我重新制作一下 这是一下简单的效果 下面介绍怎么使用 首先 先下载 CCTwe ...
- 使用扩展名获取mimetype
在Android中很多时候我们需要计算出文件的mimetype,而我们通常的思路就是通过扩展名来获取对应的mimetype,而如果自行处理,将维护一个比较大的映射表,而实际上大可不必,Android提 ...
- C语言中为什么不能把char**赋给const char**
这是我在知乎回答的一个问题. 这个问题是C中的一个深坑,首先说结论: char ** 和 const char ** 是两个不相容(incompatible)的类型,能够理解为不能直接赋值 在C11的 ...
- asp.net 连接sqlserver数据库
在asp.net中连接sqlserver数据库之前,首先得确保正常安装了sqlserver2008,同时有数据库. 在项目中添加一个类DB,用来专门负责执行对数据库的增删改查.在添加的过程中会弹出下面 ...