HTML语言：经典笔记

引自 http://www.cnblogs.com/yoyebina/archive/2006/12/21/598667.html

一、HTML语言简述

HTML：Hyper Text Markup Language 的简写，意为： 超文本标记语言；
HTML：不是 程序 语言，它只是一种 标记 语言，一种 文本 语言；
HTML：所有标记都必须用尖括号（ " < " 和 " > " ）括起来；
HTML：大部分标记是成对出现的，结束标记须以"/"开头；只有少数标记不成对出现；
HTML： 标记不区分大小写，web标准中是小写的;
               默认情况ASP.NET 2.0 中系统提供的HTML标记都用小写字母表示；
HTML：已成为各种浏览器的通用标准，并独立于各种操作系统平台；
HTML：的 重要性：是所有浏览器都能识别的语言，是浏览器生成网页的基础；
                        不管你采用哪种技术，哪种语言最终都以HTML的形式输出；
另外：XML语言的标记可以任意定义，所以HTML标记可以说是其中的一部分。

 

 

---

 

 

二、HTML语言的精华——超链接

超链接是HTML语言的精华。
在HTML语言中使用A标记来创建超链接

文字链接
耀眼冰蓝
基本格式：

< a  href ="URL(必选项)"  target ="目标(可选项)"  title ="鼠标放上时显示的文字(可选项)" > 文本 </ a >

锚点(书签)链接
回到顶部       跳转到其它页面的指定部分 
基本格式：

< a  name ="top"  id ="top" ></ a > 　 <!-- 定义锚点的方法:只是把 href 换成了 name 而已. -->
< a  href ="#top" > 回到顶部 </ a >< br  />
< a  href ="http://www.cnblogs.com/yoyebina/archive/2006/11/12/558479.html#20"  target ="_blank" > 跳转到其它页面的指定部分 </ a >

邮件链接
给耀眼冰蓝发信
基本格式：

< a  href ="mailto:[email protected]?subject=关于耀眼冰蓝的博客" >
< SPAN  style ="TEXT-DECORATION: none" > 给耀眼冰蓝发信 </ SPAN >
</ a >

 图片链接

基本格式：

< a  href ="http://yoyebina.cnblogs.com"  target ="_blank"   >
< img  src ="http://www.yoyebina.com/Images/logo.gif"  border ="0"  alt ="点击去耀眼冰蓝的博客"   >
</ a >

移动链接(目的：增加吸引力)
点这里查看详细方法...
基本格式：

< marquee >
< a  href ="http://www.cnblogs.com/yoyebina/archive/2006/11/22/569178.html"  target ="_blank"   >
< SPAN  style ="TEXT-DECORATION: none" > 点这里查看详细方法 </ SPAN >
</ a >
</ marquee >

---

三、提高代码的可读性——注释语句

下面是单行和多行两种注释语句：

<!-- 单行的注释语句:欢迎访问耀眼冰蓝的博客: http://yoyebina.cnblogs.com -->

<!-- 这是一条多行的注释语句,
欢迎访问耀眼冰蓝的站点: http://www.yoyebina.com -->

---

四、格式化文本

< font  face ="宋体"  size ="2"  color ="green" > http;//yoyebina.cnblogs.ocm </ font >

上标:耀眼冰蓝 < suP > yoyebina </ sup >
下标:耀眼冰蓝 < sub > yoyebina </ sub >

粗体: < B > 耀眼冰蓝 </ B >
斜体: < I > 耀眼冰蓝 </ I >

下划线: < U > 耀眼冰蓝 </ U >
删除线: < S > 耀眼冰蓝 </ S >

效果如下：
http://yoyebina.cnblogs.com

上标:耀眼冰蓝^yoyebina

下标:耀眼冰蓝_yoyebina


粗体:耀眼冰蓝

斜体:耀眼冰蓝


下划线:耀眼冰蓝

删除线:耀眼冰蓝

---

 

 五、格式化段落

·分段标记P：用该标记时会跳过一个空行，若省略结束</p>,则可将开始标<p>记放在段尾。
   其常用属性是align,用于设置段落的水平对齐方式。

·换行标记br：强行规定当前行中断，使后续的内容在下一行显示。

·标题标记Hn：n的取值是1到6，当n取1时，标题的字号最大；当n取6时，标题的字号最小；

·水平线标记hr：属性有：align(默认为center)， color， noshade(无阴影)， size(竖直尺寸)， width(水平长度)

·如果要将部分内容居中对齐，可以用<center>和</center>
   如果要将多个段落设置为相同的对齐方式，可用<div>和</div>

---

 

 六、引用多媒体

背景音乐
<bgsound src="URL" loop="*"> loop设定循环的次数,loop=infinete表示不断循环到关闭为止

插入图象
<img src="Images/yoyebina.gif" alt="我的图片" bordor="1">
img标记的常用属性:src,alt.height,width,border,hspace(图片与左右两端文本距离),vspace(图片与上下两端文本距离) ,align

插入视频
<img src="yoyebina.avi">

插入动画
<embed src="yoyebina.swf/midi"></embed>

通用标记
<object 属性=属性值></object>

---

 

  七、头部内容

头部的内容在网页中 基本上（标题会显示）不显示出来，但也是非常重要的。

收藏夹小图标：
制作一个16x16的icon图标，命名为favicon.ico，放在根目录下；然后将下面的代码嵌入head区：

< link  rel ="icon"  href ="/favicon.ico"  type ="image/x-icon"   />
< link  rel ="shortcut icon"  href ="/favicon.ico"  type ="image/x-icon"   />

八 返回前一页
点击下面的"返回"就会回到你刚才来的那人页面：
返回

< A  href ="javascript:history.back()" >< SPAN  style ="TEXT-DECORATION: none" > 返回 </ SPAN ></ A >

如果你想要将你的网站在收藏夹网址之前的IE图标变成了自己设定的图标，可以将以下的代码段加入你的head区：
<link rel="icon" href="/图片名.ico" type="image/x-icon" />
<link rel="shortcut icon" href="/图片名.ico" type="image/x-icon" />