您的位置：首页 > Web前端 > HTML

Html简介1

2014-12-11 10:18 176 查看

1.什么是HTML和网页文件

 HTML：是英文HyperText Markup Language(超文本标签语言)的缩写

 以"<标签名>"表示标签的开始，以"</标签名>"表示标签的结束

 成对标签又称之为容器，一对标签中还可以嵌套其它的标签

 单独标签不需要与之配对的结束标签，又称之为空标签，例如 

 一个HTML标签及标签中嵌套的内容就是网页中的一个"HTML元素"

 属性设置的一般格式为：属性名=属性值，属性值部分可以用英文的双引号(")或单引号(')引起来，也可以不使用任何引号

 标签名、属性名和属性值都是大小写不敏感的，但是要养成统一的大小写习惯
2.浏览器访问网页文档的方式

3.HTML规范与版本

 谁来指定规范

 --IETF

 --W3C

 正在使用的HTML版本

 --HTML4.01(最终的版本)

 --XHTML(将会替代HTML)

 --HTML5

4.HTML的全局架构标签

 <html></html>

 <head></head>:头部元素

 <body></body>：主体部分

5.<body>标签的属性

 Text属性：用于设定整个网页中的文字颜色

 link属性：用于设定一般超链接文本的显示颜色

 alink属性：用于设定鼠标移动到超链接上时，超链接文本的显示颜色

 vlink属性:用于设定访问过的超链接文本的显示颜色

 background属性：用于设定背景墙纸所用的图像文件，可以是DIF或JPEG文件的绝对或相对路径

 bgcolor属性：用于设定背景颜色，当已设定背景墙纸时，这个属性会失去作用，除非墙纸具有透明部分

 leftmargin属性：设定网页显示画面与浏览器窗口左边沿的间隙，单位为像素

 topmargin属性：设定网页显示画面与浏览器窗口上边沿的间隙，单位为像素

 class、name、id、style等属性

6.文档类型定义

 DTD语法：

 <!DOCTYPE HTML PUBLIC "version name" "url">

 HTML 指定文档类型名称

 PUBLIC 表明所依据的DTD文件对任何人公开访问，而不是某个公司内部的规范文件

 version name 指定该HTML版本的标识名称。例如，HTML4.0的标识名称为"-//W3C//DTD HTML 4.01 Transitional//EN"。

 对于ISO标准的DTD以"ISO"三个字母开头,被改进的非ISO标准的DTD以加号"+"开头,未被改进的非ISO标准以减号"-"开头。

 url 指定该HTML语言的定义规范文件在Internet上的位置，例如，http://www.w3c.org/TR?html4/loose.dtd。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

7.注释与特殊字符

 用""这种格式加入注释

 特殊字符可以用数值和引用实体来表示，例如，$#169;\$copy;

8.格式标签

 :p标签对,表示段落

 :换行符

 :不换行符，防止浏览器把过长的内容自动换行

 <blockquote></blockquote>:以缩进的方式在浏览器中显示

 <center></center>:在水平方向上水平显示

 <marquee></marquee>:以移动的方式显示marquee中的内容

 其中的两个属性:direction="up,down,left,right":控制移动的方向

 behavior="slide,scroll,alternate":控制移动的方式<slide:只移动一次,scroll:循环移动,alternate:折返的移动>

 <dl></dl><dt></dt><dd></dd>:定义显示列表

 <ol></ol>:定义带数字列表

 <ul></ul>:定义带圆点列表

 <li></li>:定义列表项

 <pre></pre>:预格式化处理,显示所有的空格和换行

9.文本标签

 <h1></h1>...<h6></h6>:以标题的方式显示，数字越大，字体越小

 :粗体

 ：斜体

 ：加下划线

 :下标表示

 :上标表示

 <tt></tt>:以打印字风格显示的字体

 <cite></cite>:以引用的方式显示字体

 :显示需要强调的字体：斜体加粗体

 :显示需要加重的字体：黑体加粗体

 :对字体，字号，颜色随意改变

 其中三个属性：face：字体名称，若没有指定字体，则忽略这个属性，用浏览器默认字体

 size：字号(-7~7)，数字越小，字体越小或像素

 color：字体的颜色

10.超链接标签

 超链接标签:<a href="">link</a>

 href:指定url:统一资源定位器

 <a href="mailto:775192833@qq.com?subject=test"> 发邮件 </a>

 target:"_blank"

 定位到网页中的某一处<a name="mark">定位</a>

 <a href="xxx.html#mark"></a>

 <a href="#">...</a>与<a href="">...</a>的区别：""会打开默认目录，"#"什么也不做

11.url(uniform resource locator):统一资源定位器

 URL的基本组成：协议、主机名、端口号、资源名

 相对url:"a.html","./a.html","../../a.html","a.html"

 为url指定参数:a.html?name=wzg&password=123

 带有定位标记的url：a.html#mark


mailto:zxx@qq.com?subject=Feedback&body=how%20are%20you!

 URL编码

 规则

 将空格转换为加号(+)

 对0-9、a-z、A-Z之间的字符保持不变

 对于所有其他的字符，用这个字符的当前字符集编码在内存中的十六进制格式表示，并在每个字节前加上一个百分号(%).

 对于空格也可以直接使用其十六进制编码方式，即用%20表示，而不是将它转换成加号(+)

 说明

 如果确信URL串的特殊字符没有引起使用上的歧义或冲突，你也可以对这些字符不进行编码，而是直接传递给服务器

 如果URL串中的特殊字符可能会产生歧义或冲突，则必须对这些特殊字符进行URL编码

12.图像标签

 <img src=""></img>

 还可以设置alt：图像无法加载时，显示alt设置的文本、align：设置对其方式、border：设置边框、width：宽度、height：高度等属性

 <img>标签的显示过程

 没有真正加载图像数据，而是通过src指定图像的路径，把请求发送给服务器，服务器返回数据，既可以读取一个图像，也可以动态产生数据

 分析：一个WEB服务器是如何借助<img>标签来收集其他web站点的页面访问次数的？

 <hr>标签：水平线，可以设置size：粗细、color：颜色、width：宽度和noshade：无阴影

13.图像地图

 图像超链接

 格式为：<a href="url"><img src="#"></img></a>

 什么是图像地图

 把一幅图像分成多个区域，每个区域指向不同的URL地址。

 怎样产生一个图像地图

 1)首先必须定义出图像上的各热点区域的形状、位置坐标、及其指向的URL地址等信息，这个过程叫图像热点映射。

 图像热点映射需要使用<map name="mapName"></map>标签对进行说明，其中的name属性为该图像热点映射指定了一个名称

 2)图像热点映射中的各个区域用<area>标签说明，<area>标签的格式为：<area shape="形状" coords="坐标" href="URL">

 href部分也可以用nohref替换，表示在该区域单击鼠标无效。<area>标签还可以有一个target属性，用来指明浏览器在哪个窗口或帧中显示href属性所指向的网页资源。

 3)定义好了图像热点映射后，接着就要在<img>图像标签中增加一个名为usemap的属性设置，usemap属性指定该图像被用作图像地图，其设置值为所使用的图像热点映射名称，

 格式为：在<img>标签的name属性设置值前多加一个"#"字符。例如,<img src="china.jpg" usemap="#mapName"></img>

 shape属性的设置说明

 rect：定义一个矩形区域，coords属性设置值为矩形的左上角、右下角的坐标，各个坐标值之间用逗号分开；

 poly：定义一个多边形区域，coords属性设置值为多边形各顶点的坐标值

 circle：定义一个圆形区域，coords属性设置为圆心坐标及半径，前两个参数分别为圆心的横、纵坐标，第三个参数为半径。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航