Html简介1

1.什么是HTML和网页文件
    HTML:是英文HyperText Markup Language(超文本标签语言)的缩写
    以"<标签名>"表示标签的开始,以"</标签名>"表示标签的结束
    成对标签又称之为容器,一对标签中还可以嵌套其它的标签
    单独标签不需要与之配对的结束标签,又称之为空标签,例如<br>
    一个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></p> :p标签对,表示段落
    <br>:换行符
    <nobr></nobr>:不换行符,防止浏览器把过长的内容自动换行
    <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>:以标题的方式显示,数字越大,字体越小
    <b></b>:粗体
    <i></i>:斜体
    <u></u>:加下划线
    <sub></sub>:下标表示
    <sup></sup>:上标表示
    <tt></tt>:以打印字风格显示的字体
    <cite></cite>:以引用的方式显示字体
    <em></em>:显示需要强调的字体:斜体加粗体
    <strong></strong>:显示需要加重的字体:黑体加粗体
    <font></font>:对字体,字号,颜色随意改变
        其中三个属性:face:字体名称,若没有指定字体,则忽略这个属性,用浏览器默认字体
        size:字号(-7~7),数字越小,字体越小或像素
        color:字体的颜色

10.超链接标签
    超链接标签:<a href="">link</a>
        href:指定url:统一资源定位器
    <a href="mailto:[email protected]?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:[email protected]?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属性设置为圆心坐标及半径,前两个参数分别为圆心的横、纵坐标,第三个参数为半径。

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。