HTML语法大全

最新推荐文章于 2021-07-02 22:43:53 发布

lhyer

最新推荐文章于 2021-07-02 22:43:53 发布

阅读量966

点赞数 1

分类专栏： HTML基本语法文章标签： HTML语法 html

HTML基本语法专栏收录该内容

2 篇文章 0 订阅

订阅专栏

HTML基本语法大全

虽然已经有很多现成的HTML编辑器可以用，不必再自己编写HTML文件，但学习手工编写HTML文件的必要性的理由在于：

1、现在HTML标准一直在改进中，而现成的HTML编辑器并不一定跟得上HTML的潮流。

2、可以看到，用HTML编辑器编出来的HTML文件结构相当乱，这是因为在编辑过程中，编辑器并不能真正理会用户的编辑要求，结果反复修改后，就留下不少垃圾。

3、自己编写HTML文件，可以随时将HTML的新发展增加进去，而不用受编辑器的限制。

4、HTML是一种很有意思的语言，它能将你的想法在INTERNET上很好地体现出来。

HTML语句特点：

1.所有HTML语句大部分都是<TAG></TAG>结构，<TAG>表示打开标记，</TAG>表示关闭标记。但是有的语句只有描述开始标记，没有描述结束，如<p>
2.HTML中对文字的大小写不敏感。
3.所有语句都可以循环嵌套，但要注意嵌套对称。
例：<h3><center>…….</center></h3> 就是正确的嵌套方法
<h3><center>…….</h3></center> 这种书写方法将导致编译错误

一、HTML文档的基本结构

HTML部分：每个HTML文档必须以打开HTML标记开始，以关闭HTML标记结束
<HTML></HTML> 说明其间内容为HTML格式文档。

头部分：此部分包含文档的标题、文档使用的脚本、样式表定义等信息，还可以包含

搜索工具和索引所要的其他信息。头部分必须包含在<HEAD></HEAD> 标记对中

1.<TITLE></TITLE> 其间包含的文字是该HTML的主题，会显示在窗口的TITLE栏位

2.<META>标记，此标记可以设置网页的编码、自动刷新网页、设置网页的过期值

u        <meta name=”author” content=”…….”>
u        <meta name=”keyword” content=”…..”>
u        <meta http-equiv=”Expires” content=”mon, 15 sep 2003”>
u        <meta http-equiv=”Refresh” content=”10”, url=http://yourlink”>
u        <meta http-equiv=”Content-Type” content=”text/html;charset=gb2312”>

一、正文部分

<BODY></BODY> 其间说明HTML文件的主体内容。
BACKGROUND=“图形名” 背景图形文件
TEXT=#RRGGBB 文字颜色（一般为黑 #000000）
LINK=#RRGGBB 链接标志文字颜色
VLINK=#RRGGBB 具有超连接部分显示的颜色，点过之后为ALINK的颜色
ALINK=#RRGGBB 已经链接标志文字颜色
ONLOAD=“扩展函数调用串” 与<SCRIPT>一同使用
<- text -> text 是描述性文字，注释。
<SCRIPT></SCRIPT> 描述一扩展语言。其中： LANGUAGE=“javascript” 描述以下为Java语言

二、字　　体

<Hy></Hy> (y=1-6) 用于说明各级标题文字，y=1时字体最大，y=6时字体最小。其中：
ALIGN=缺省对左(LEFT)
　　 =CENTER 对中
　　 =RIGHT 对右
<CAPTION></CAPTION> 显示标题文字（一般用于TABLE显示表格）
<FONT></FONT> 字体大小设置（NETSCAPE ONLY）其中：
SIZE=-4 ~ +4 将字体设置为BASEFONT的相对大小
COLOR=#RRGGBB 字体颜色（R、G、B三色）
<BASEFONT></BASEFONT> 设置基本字体（NESCAPE ONLY）其中： SIZE=1-6

三、字型变化

Italic（斜）字体：<I></I> 斜体字　 <EM></EM> 着重字　<CITE></CITE> 段落、书名的引用　
                  <VAR></VAR> 表明可变内容(如文件名)
Bold（黑）字体： <B></B> 黑体字　<STRONT></STRONG> 加强字,
Fixed width font（紧凑）字体：<TT></TT> 紧凑字（打印机字体）　
                              <CODE></CODE> 紧凑字
                              <SAMP></SAMP> 样本字
                              <KBD></KBD> 显示键盘上键名
其它字体修饰： <U></U> 下划线　<BLINK></BLINK> 闪烁字
特殊字符：（CREN中列表） < < < > > > & & & " "
           " ö ñ ± è 《 @ @ © (c) （NETSCAPE ONLY） ®; （NETSCAPE ONLY）非中断空格

四、　段　　落

<P> 单独表示段落结束。 <P></P> 表示其间文字是同一个段落，段落显示分成若干行，在何处分行由浏览器的窗口宽度决定，可适应任何宽度的窗口。

其中： ALIGN=缺省对左（LEFT） =CENTER 对中 =RIGHT 对右
       <BR> 在页面上加一个回车。
       <HR> 显示一条水平分界线。其中：（以下NETSCAPE ONLY）
       SIZE=n 高度点数　
       WIDTH=n 宽度点数 =n% 宽?**计聊话俜直?
       ALIGN=缺省对中 =LEFT 对左 =RIGHT 对右
       <CENTER></CENTER> 表示其间内容显示向中间对齐。（NETSCAPE ONLY）
       <PRE></PRE> 预设文字格式（Preformatted Text）其中的文字间隔、跳行、空白照原始
       键入情形显示出来，常用于程序的表达。其它标注也允许存在<PRE>中。
       <BLOCKQUOTE></BLOCKQUOTE> 区块引用设定。其中的文字内容会比其他文字缩进一些。
       <ADDRESS></ADDRESS> 地址区域。通常放在最后，包含一个EMAIL地址，告知本页面作者。
       显示为斜体字。段落示例

五、　链　　接

<A></A> 链接标记。其间文本（图像）将显示出来，并用链接颜色和下划线区别出来。

其中:NAME=“position” 表示页面中position处

HREF =“#position” 表示链接到本页面position处
NAME=“filename#position” 链接到filename文件的position处

               =“filename.html” 链接到指定的filename页面
     NAME=“filename.gif” 显示指定的图形图形格式为GIF、TIEF、JPEG、RGB、HDF等格式
     NAME=“scheme://host-domain[:port]/path/filename” 链接到指定主机的指定页面

scheme是http、ftp等 host-domain为服务器名 port为提供此服务的端口号，缺省为８０，可省略

六、　图　　像

<IMG></IMG> 显示图像。

其中:ALIGN=BOTTOM缺省文本在图像下面 =MIDDLE 在中间 =TOP 在上面
     SRC=“图像名” 图像文件
     ALT=“text” 图像别名，若图像不显示时，显示在虚框内
     WIDTH=n 宽度点数 =n% 可显示面积的百分比
     HEIGHT=n 高度点数 =n% 可显示面积的百分比
     BORDER=n 立体边框厚度点数
     HSPACE=“图像名” 水平空间（NETSCAPE ONLY）
     VSPACE=“图像名” 垂直空间（NETSCAPE ONLY）
     ISMAP 说明本图像为地图
     USEMAP=“#name” 给本图像取一个地图名
     <MAP></MAP> 对一幅地图进行*作。其中： NAME=“name” 由<IMG>中指定的地图名
     <AREA></AREA> 区域选择。在<MAP>中使用, 其中:SHAPE=RECT矩形区域，只需提供对角坐标(x1,y1,x2,y2),=POLYGON多边形，要提供多边形各顶点坐(x1,y1,...,xn,yn)
     COORDS=x1,y1,...,xn,yn 坐标值(１０进制)
     HREF=链接对象（参照<A>）图像示例

七、　列   表

以下各种排列可以综合嵌套排列，成为有层次的排列。<UL></UL> 未标序的排列（Unnumbered Lists）在其中的每一行文字前加上<LI>，起始会
显示“●”或“□”或“■”等，具体显示什么由具体的浏览器决定。
<OL></OL> 标序的排列（Numbered Lists或Ordered Lists）在其中的每一行文字前加上
<LI>，起始会显示数字编号。
<LI></LI> 每一行文字的起头。
<DL></DL> 陈述式排列（Descriptive Lists）
<DT></DT> <DL>中显示陈述的主题。
<DD></DD> <DL>中显示叙述的内容，会比<DT>内容缩入一些位置。在<DT>和<DD>中，可包含其它链接内容。
<DIR></DIR> 显示清单，每行最多２０个字符。在其中的每一行文字前加上<LI>。
<MENU></MENU> 显示菜单。在其中的每一行文字前加上<LI>。
　　　　　　　　　　　　

八、输入框（输入表格）

<FORM></FORM> 说明一个输入表格。这是从浏览器向服务器发回反馈信息或交互运行的重要方式。

其中：METHOD=GET 从服务器获取信息
　　　　 =POST 发送表格信息到服务器
ACTION=“CGI-program” CGI-program是服务器上一个可执行程序，其接口标准为CGI (Common Gateway Interface)，它将处理浏览器发送回来的填表信息。

表格中可以使用多种元件，如输入框、列表、按钮等。
<INPUT></INPUT> 输入框或按钮选择。在<FORM>中使用。

其中：SIZE=n 输入框或按钮大小
      NAME=“name” 便于CGI-program识别的变量名
      TYPE=“type” 类型（见下）
　　      =TEXT 文本输入框，只有一行
　　     =PASSWORD 口令输入框，输入的信息不显示出来
　　     =CHECKBOX 确任盒（[ ]或[X]）
　　      =RADIO 圆按钮，几个同名的RADIO只能按下一个
　　      =SUBMIT 发送按钮，按动后发出已填好的表格
　　      =RESET 重置按钮，按动后将所有元件重置为缺省值
　　      =IMAGE
　　      =HIDDEN
     VALUE=“value” 缺省值（见下）
　　　    =字符串对于TEXT和PASSWORD
　　　    =ON/OFF 对于CHECKBOX和RADIO
　　　    =显示字符串对于SUBMIT和RESET
<TEXTAREA></ textarea> 说明一个可以多行输入的文本输入框。其间的文本内容为缺省的文本输入框内容。

其中：NAME=“name” 变量名
ROWS=n 输入框行数
COLS=n 输入框列数
<SELECT></SELECT> 显示一个选择列表。在其中的每一行文字前加上<OPTION>。

其中：NAME=“name” 变量名
      SIZE=1 显示一个*作菜单（Option Menu） >=2 显示一个滚动列表（Scrolled List） SI
      ZE为列表显示出来的行数
      <OPTION></OPTION> 每一行列表的起头。在<SELECT>中使用。
　　　　　　　　　　　　　

九、显示表格

<TABLE></TABLE> 显示二维表格。

其中：BORDER=n 二维表格的立体边框厚度点数
      WIDTH=n 宽度点数 =n% 宽?**计聊话俜直?
      CELLPADING=n 是指TABLE中框架与元素的边界的距离
      CELLSPACING=n 表格中每项之间的空间点数，包括横向和纵向。
      <TR></TR> 在表格的每一行开头加上<TR>(Text Row)。其中：
      ALIGN=CENTER 对中 =LEFT 对左 =RIGHT 对右
      <TH></TH> 在表格的每一种类项目开头加上<TH>(Text Head)，显示为黑体字。
      <TD></TD> 在表格的每一个项目开头加上<TD>(Text Data)。其中：
      WIDTH=n 宽度点数=n% 宽?**计聊话俜直?
      HALIGN =CENTER 对中
　　　　     =LEFT 对左
　　　　     =RIGHT 对右
      VALIGN =TOP 在上面
　　　　     =MIDDLE 在中间
　　　　     =BOTTOM 在下面

2.2 区段格式标记
　　主要的有：
　　<title>...</title>:文件题目。
　　<hi>...</hi>:i=1,2,...,6,网页标题。
　　<hr>:产生水平线。
　　<br>:强迫换行。
　　<p>...</p>:文件段落。
　　<pre>...</pre>:以原始格式显示。
　　<address>...</address>：标注联络人姓名、电话、地址等信息。
　　<blockquote>...</blockquote>:区段引用标记。

2.3 字符格式标记
　　<b>...</b>:粗体字。
　　<i>...</i>:斜体字。
　　<tt>...</tt>:打字体。
　　<font>...</font>:改变字体设置。
　　<center>...</center>:居中对齐。
　　<blink>...</blink>:文字闪烁。
　　<big>...</big>:加大字号。
　　<small>...</small>:缩小字号。
　　<cite>...</cite>:参照。

2.4 列表标记
　　<ul>...</ul>:无编号列表。
　　<ol>...</ol:有编号列表。
　　<li>...</li>:列表项目。
　　<dl>...</dl>:定义式列表。
　　<dd>...</dd>:定义项目。
　　<dt>...</dt>:定义项目。
　　<dir>...</dir>:目录式列表。
　　<menu>...</menu>:菜单式列表。

2.5 链接标记
　　<a>...</a>:建立超链接。

2.6多媒体标记
　 <img>:嵌入图像。
　　<embed>:嵌入多媒体对象。
　　<bgsound>:背景音乐。

2.7表格标记
　　<table>...</table>:定义表格区段。
　　<caption>...</caption>:表格标题。
　　<th>...</th>:表头。
　　<tr>...</tr>:表格列。
　　<td>...</td>:表格单元格。

2.8表单标记
　　此类标记用来制作交互式表单，主要的有：
　　<Form>...</form>:表明表单区段的开始与结束。
　　<input>:产生单行文本框、单选按钮、复选框等。
　　<textarea>...</textarea>:产生多行输入文本框。
　　<select>...</select>:标明下拉列表的开始与结束。
　　<option>...</option>:在下拉列表中产生一个选择项目。

3.1 <html>：标示整份文件
　　用途：标示整篇html文件
　　说明：一个标准的html文件是一篇以<html>开头，而以</html>结束的文件。即：
　　<html>
　　... html文件全文
　　</html>

3.2<head>:文件标题区
　通常head区段都内含在html区段之中，
　　<html>
　　<head>
　　...... html文件标题区
　　</head>
　　.....
　　</html>

3.3<title>:网页标题
　　<title>.....</title>是html文件标题区中最重要也是最常用的标记. 其他标题区的标记还包括 <base>、<isindex>、<link>、<nextid>、<meta>等。
　　<title>标记的用途是设置网页标题，这个标题会显示在浏览器窗口的标题栏上,不会出现在浏览器的页面（page）文字中。

3.4<body>:标示出文件主体区
　　说明：在html文件中，由<body>...</body>所夹住的区域称为文件的主体区，通常是在<head>区段之后。

backgroud属性：这个属性可以指定一个图形文件(一般为gif或jpeg)，作为背景图案。