HTML学习笔记.docx
- 文档编号:6610633
- 上传时间:2023-01-08
- 格式:DOCX
- 页数:14
- 大小:24.20KB
HTML学习笔记.docx
《HTML学习笔记.docx》由会员分享,可在线阅读,更多相关《HTML学习笔记.docx(14页珍藏版)》请在冰豆网上搜索。
HTML学习笔记
第一章语法
Html的全部语法
1.HTML标签和元素;
2.HTML语法不区分大小写;
3.HTML标签属性;
4.HTML颜色值的设置;
5.HTML文档注释;
6.HTML代码格式;
7.HTML字符实体;
1.标签:
html--定义html文档body--定义文档体body
head--定义文档头信息headtitle--定义文档的标题title
a--html链接标签aimg--html图像标签img
div--html层divtable--定义html表格table
tr--定义表格行trtd--定义表格列td
form--html表单标签forminput--定义表单的输入域input
2.链接属性
3.放在<>内的浏览器不显示;
4.换行不能用“;”
5.元素:
开始标签+结束表+之间的内容总称为元素;
6.标签:
独立标签和成对标签;不需要包含内容的就是独立标签
7.标签与大小写无关;大写和小写一样;
8.标签属性:
多个属性用空格隔开;属性值和属性名用“=”;
9.属性名:
用“”或‘’或不用引号;也可以不用引号;
第2章标签属性
1.属性含私有属性和共有属性;
2.颜色值:
十六制或英文表示,十六制用六位表如:
#FFAABB
3.注释:
---->;调试程序用;写程序用;保留程序;建议不要用注释,因为服务器发送到客户端会占用带宽;
4.浏览器会忽略空格和回车;写代码是尽量不要使用空格或回车;
5.标签可以嵌套;
6.Html字符实体:
特殊字符在页面中显示,如显示
所有实体都是以&符开始以分号结尾;如&it;>;
代码
效果
代码
效果
"
“
&
&
<
<
>
>
空格
©
©
§
§
¤
¤
7.html中不管有多少个空格都是以一个出现的;
第3章HTML标签
1.html主体结构:
不显示在页面中的内容(设置页面的行为、)head元素包含的常用标签:
a.title标签--代表HTML文档的标题
b.base标签--将相对URL转换为完整的绝对URL
c.meta标签--用于定义文件信息的名称、内容等信息
d.link标签--当在文档中声明使用外接资源(如CSS)时使用此标签
e.style标签--在文档中声明样式时使用此标签
f.script标签--在文档中使用JavaScript脚本
显示的内容第四章html的格式标签
1.格式
标签
描述
换行标签,完成文字的紧凑显示。
可以使用连续多个
标签来换行
段落标签,里面可以加入文字,列表,表格等,可以或
使用居中对齐标签,使段落或文字相对于上一层标记居中显示
按原文显示标签,可以把原文件中的空格,回车,换行,tab键表现出来
代表HTML列表项目,每个列表项使用一对
- 标签定义
- 标签定义
水平分割线标签,用于段落与段落之间的分割
第五章文本标签
1.
标签
描述
标题字标签,n为1-6,定义六级标题,而且会自动换行插入一个空行
粗体字标签
斜体字标签
下划线字体标签
文字下标字体标签
文字上标字体标签
字体标签,可以通过标签的属性指定文字的大小、颜色及字体等信息
打字机文字
用于引证、举例、通常为斜体字
表示强调,通常为斜体字
表示强调,通常为粗体字
小型字体标签
大型字体标签
第七章超链接
1.
链接文字 Url:
统一资源定位符,只要涉及到定位的都用到;
URL:
协议:
http
主机:
xjqg.edu,cn
资源:
aaa/bb/xindex.asp
参数:
?
变量=值&变量=值
相对路径:
相对于你现在位置找你上一个路径或下一个路径;./当前目录;../上级目录
绝对路径:
从根上开始找;
第八章超链接
1.
Title附加信息;每个标签都可以添加;当鼠标指向titl是显示指定内容;
2.在新的页面打开链接:
target=””;_self打开自己;_blank新的页面打开;_parent;_top;name
3.Name属性:
锚点用
定位; 4.返回顶端:
返回用#作为锚点; 5.链接到指定其它文件的锚点:
第九章图片img标签
1.中宽度和高度设定一个就会等比例缩放;
2.alt--代表图像的替代文字
src--代表一个图像源(就是图像的位置)
border–代表图片边框的宽度
height--代表一个图像的高度
width--代表一个图像的宽度
Usename:
与图像地图配合使用;
设计网页时经常使用的图片有三种格式:
GIF--最多支持256色,支持透明,支持多帧动画显示效果.
JPEG--支持多种颜色,可以有很高的压缩比,使用了有损压缩,不支持透明,不支持动画效果.
PNG--是一种新的图片技术,可以表现品质比较高的图片,使用了无损压缩,支持透明,不支持动画.
3.图片地图
map标签--定义图像点击区域的集合
map标签是成对出现的,即,而且必须配合area标签使用。
map标签中name与id属性指定的值必须与定义图像点击区中图像(img)的usemap属性指定的值一致。
属性
id--定义map的名称。
name--定义map的名称。
area标签--定义图像点击区域,
area标签是单独出现的,
area标签必须使用在map标签中,而且必须配合img标签使用。
属性
accesskey--链接的快捷键访问方式
alt--图像的提示文字
coords--定义可点击区域图形的坐标
href--HTML链接源的URL
nohref--图像点击排除的区域,当不使用href时应使用nohref
shape--可点击区域的形状
tabindex--使用"Tab"键的遍历顺序
target--链接目标
第九章HTML的表格使用
table标签属性:
width--代表表格的宽度
height--代表表格的高度
border--代表表格边框(此属性应该使用CSS实现)
cellspacing--代表表格边框与表格内容填充的距离,也是内容填充之间的距离(此属性应该使用CSS实现)
cellpadding--代表内容填充的宽度(此属性应该使用CSS实现)
th、td标签属性:
width与height–代表宽度与高度
colspan--一行跨越多列
rowspan--一列跨越多行
align--代表水平对齐方式(left(左对齐)|center(居中对齐)|right(右对齐)|justify)(此属性应该使用CSS实现)
valign--代表垂直对齐方式(top(顶部对齐)|middle(中部对齐)|bottom(下部对齐)|baseline(基线对齐))(此属性应该使用CSS实现)
tr标签属性:
align与valign具体解释详见上面。
表格可以嵌套表格;
第十一章HTML的框架结构
*通配符,剩余不得部分
不建议在前段使用,不利于搜索引擎抓取数据;建议在后台使用;
分帧框架不能和body体同时使用;不能写到body体中;
--内层框架结束-->
您的浏览器不支持框架,请升级浏览器
--外层框架结束-->
HTML框架简述
一个浏览器窗体可以通过几个页面的组合来显示。
我们可以使用框架来完成(frames)这项工作。
(框架可以把HTML文档分为多个页面)。
也就是将一个浏览器文档窗口分隔成多个窗口,每个窗口都可以显示一个独立的网页文件。
框架页使用了表格的方式组合,可以分为数行与数列。
框架的优点
重载页面时不需要重载整个页面,只需要重载页面中的一个框架页(减少了数据的传输,增加了网页下载速度)。
方便制作导航栏。
框架的缺点
会产生很多页面,不容易管理。
不容易打印。
浏览器的后退按钮无效。
代码复杂,无法被一些搜索引擎索引到。
多数小型的移动设备(PDA手机)无法完全显示框架。
多框架的页面会增加服务器的http请求。
由于上面诸多缺点,因此不符合标准网页设计的理念.已被标准网页设计抛弃
第十四章表form标签--代表HTML表单
Image的作用是提交,提交过得左表位置;
Form中可以使用三种标签inputtextareaselect
Input中type和name是必须要有的,没有name服务器就无法获取数据;
复选框的名称不能一致,可以用数组的方式命名
可以用
单选框的名称必须一样(name)
orm标签是成对出现的,以
结束常用属性.
action--浏览者输入的数据被传送到的地方,如一个PHP页面(dofm.php)
method--数据传送的方法
get--此方式传递数据量少,但是传递的信息显示在网址上。
post--此方式传送信息多,而且不会把传递信息显示在网址上
enctype--表示将数据发送到服务器时浏览器使用的编码类型
application/x-www-form-urlencoded--窗体数据被编码为名称/值对.这是标准的编码格式.默认的。
multipart/form-data--窗体数据被编码为一条消息,页上的每个控件对应消息中的一个部分.
text/plain--以纯文本形式进行编码,其中不含任何控件或格式字符
单
input标签--代表HTML表单的单行输入域
input标签是单独出现的,
属性.
type--代表一个输入域的显示方式(分为输入型,选择型,点击型)
name–此表单项名称
value--输入域的值
size--输入域的长度
maxlength--输入域最多可以输入文字的长度
checked--如果是选择型的输入域,代表已经被选择,值为checked
readonly--输入域可以选择,但是无法修改,值为readonly
disabled--输入域无法获得焦点,无法选择,以灰色显示,在表单中不起任何作用。
如:
disabled="disabled"
accesskey--表单的快捷键访问方式,如值为h即按Alt+h快捷键。
tabindex--输入域的"tab"键遍历顺序
src--当使用图片来表示按钮时,代表图片的位置(URI)
alt--用来替换提交按钮的图片(当在input的src属性定义的图片无法显示时)提示信息。
type属性--代表HTML表单,单行输入域(框)的表现方式
type属性取值:
text--文字输入域(输入型)
password--也是文字输入域,但是输入的文字以密码符号'*'显示(输入型)
file--可以输入一个文件路径(输入型)
checkbox--复选框.可以选择零个或多个(选择型)
radio--单选框.只可以选择一个而且必须选择一个(选择型)
hidden--代表隐藏域,可以传送一些隐藏的信息到服务器
button--按钮(点击型)
image--使用图片来显示按钮,使用src属性指定图像的位置(就像img标签的src属性)(点击型)
submit--提交按钮,表单填写完毕可以提交,把信息传送到服务器.可以使用value属性来显示按钮上的文字(点击型)
reset--重置按钮,可以把表单中的信息清空(点击型)
textarea标签--代表HTML表单多行输入域
此标签是成对出现的,即以结束
属性:
cols--多行输入域的列数
rows--多行输入域的行数
name–此表单项名称
accesskey--表单的快捷键访问方式
disabled无法获得焦点,无法选择,
灰色显示,表单中无效
readonly输入域可以选择,但是无法修改
tabindex输入域,使用"tab"键的遍历顺序
select标签--选择列表标签
select标签是成对出现的,以结束
此标签中的每对option标签代表一个选择项
属性:
name–表单项名称
size--选择域的高度
multiple--可以有多个选择
disabled--以灰色显示,在表单中不起任何作用
tabindex--使用"tab"键的遍历顺序
option标签--代表选择列表的一个选择项
option标签是成对出现的,以结束
属性:
label--说明选择项
value--说明选择项的值
selected--此选择项已经被选择
disabled--输入框无法获得焦点,以灰色显示,在表单中表示禁用
tabindex--使用"tab"键的遍历顺序
Get:
urlget通过地址栏传递
Post:
httppost
Enctype:
文件上传是必须改为“multipart/form-data”
第十五章DTD文档类型
DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.1//EN“
"http:
//www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
DTD:
(DocumentTypeDefinition,DTD)
DOCTYPEHTMLPUBLIC"versionname""url">
HTML指定文档类型的名称,为了说明这个页面使用了何种HTML规则,或者结构。
PUBLIC表明所依据的DTD文件可对任何人公开访问,而不是某个公司内部的规范文件。
versionname指定该HTML版本的标识名称。
例如,HTML4.0的标识名称为”-//w3c//DTDHTML4.01Transitional//EN”.对于ISO标准的DTD以”ISO”三个字母开头;被改进的非ISO标准的DTD以加号“+”开头;没被改进的非ISO标准的DTD以“-”开头。
url指定该HTML语言的定义规范文件在internet上的位置,例如,http:
//www.w3.org/TR/html4/loose.dtd.
规范文件:
loose.dtd、strict.dtd、frameset.dtd等文件名的区别。
头元素
头元素是指位于
标签元素,主要包括:标签对 标签 标签
标签
标签 标签用于指定网页中的超链接的基准地址,以改变网页中所有使用相对地址的URL的基准地址。 标签通常的使用形式如下: 作用
Href属性设定该网页中所有使用HTTP协议的相对URL地址的基准地址,若网页中有如
这样的超链接,它不会再象没有使用 标签时那样表示当前网页相同目录下的index.html,而是指向了 超链接的target属性用于设定该网页中所有的超链接显示的目标窗口,在
标签中设定target属性,可省得在所有的超 链接的标签中都加上target属性。 标签
标签定义了当前文档和另一个文档或资源之间的关系。
几个主要的属性:
HREF
REL与REV
TITLE
TYPE
例如, TYPE=“text/css”、TYPE=“text/javascript”
MEDIA
设置值:
screen、print、projection、aural、braille、tty、tv、all
标签
有两种类型的,用不同的属性名来划分,这两种属性名为:
name和http-equiv.
name属性用于在网页中加入一些关于网页的描述信息,例如,网页的关键字(可供网页搜索引擎机器人查找、分类)、网页的描述信息等。
http-equiv属性用于在HTML文档中模拟HTTP协议的响应消息头,例如,告诉浏览器是否缓存该网页、使用什么样的字符集来显示网页内容、隔多长时间自动刷新网页等。
meta标签的name属性设置
Keywords
例如,
Description
Robots
设置值:
index、noindex、follow、nofollow、all、none.
Generator
Author
Copyright
Content-Type
例如,
Refresh
例如,
Expires
例如,
20:
00GMT”>,将content设置为0,可以禁止浏览器使用缓存页面。
Windows-Target
例如,要防止自己的网页被别人当作一个fame页面调用,可以使用
. Pragma
例如,
.
代表HTML有序列表 ,里面每一列表项使用
- 标签定义
代表HTML无序列表 ,里面每一列表项使用
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- HTML 学习 笔记