HTML语法基础1(从西安电子科技大学JSP教程中整理)
HTML语法基础
(1)网页架构:主要网页主架构的介绍
(2)分隔标签:也就是所谓的水平线
(3)排版标签:针对标签的属性，可做适当的版面编排
(4)字体标签:教导您设定文字的字体
(5)文字标签:教导你设定文字的颜色，行距，变化等等
(6)影像标签:教导您如何在网页中，植入图像
(7)背景标签:教导您如何设定背景颜色或是背景网像
(8)链接标签：教导您如何设定超链接，以及开视窗的条件
(9)表格标签：教导您如何在网页中运用表格
(10)序列标签：教导您如何设定文字序列或图形序列
(11)表单标签：教导您如何制作可填写用的表单
(12)框架标签：可让同一个视窗同多个网页一起组成
(1)网页架构
文字上的分隔标签:强制断行标签<br>
强制分段标签<p>
原始码 | 呈现结果
---------------------------------------------------------------------
这是一个断行的范例<br>看出来了吗 | 这是一个断行的范例
| 看出来了吗
---------------------------------------------------------------------
这是一个分段的范例<p>基本上分段会 | 这是一个分段的范例
比断行还多空出一行 |
| 比断行还多空出一行
---------------------------------------------------------------------
分隔线标签:利用<hr>这个标签便可以产生一条横分隔线
---------------------------------------------------
一般用法 | 尚未加任何属性
---------------------------------------------------
原始码 | 普通他隔线<br>
---------------------------------------------------
呈现结果 | ___________________________
---------------------------------------------------
颜色属性 | 用法<hr color = "颜色码或颜色名称">
---------------------------------------------------
原始码 | 橘色分隔线<hr color="#ff8000">
---------------------------------------------------
呈现结果 | ______________________(橘色分隔线)
---------------------------------------------------
宽度属性 | 用法:<hr width="宽度">，其单位为px(像素)
| 宽度亦可以用百分比不作设定,如50%的意为宽度
| 占屏幕50%
---------------------------------------------------
原始码 | 宽度为240px的分隔线<hr width="240">
---------------------------------------------------
厚度属性 | 用法:<hr size="厚度">
---------------------------------------------------
原始码 | 厚度为5的分隔线<hr size="5">
---------------------------------------------------
位置属性 | 用法:<hr align="水平对齐位置">,其设定值有三个,
| 也就是align="left" align="center" align="right"
---------------------------------------------------
原始码 | 靠右的分隔线<hr align="right">
---------------------------------------------------
阴影属性 ｜ 用法:<hr noshade>,无设定值
---------------------------------------------------
原始码 | 实心分隔(无阴影)<hr noshade>
---------------------------------------------------
注意：除了必要的空格外，最好不要加空格，否则易出错.
这里的宽度指线的长度，而非线的粗细
MyCode1(3)排版标签
文字置左,置中,置右:
原始码 | 呈现效果
---------------------------------------------------
<p align="left">文字靠左</p> | 文字靠左
---------------------------------------------------
<p align="center">文字置中</p> | 文字置中
---------------------------------------------------
<p align="right">文字靠右</p> | 文字靠右
---------------------------------------------------
<center>标签 文字置中
原始码 | 呈现效果
---------------------------------------------------
<center>中间</center> | 中间
---------------------------------------------------
向右缩排标签:
<blockquote></blockquote>这个标签可以将其包起来的文字，全部
往右缩排.而且加一组标签，往右缩排一单位,加两组标签，信右缩排两
单位,依此类推
原始码 | 呈现效果
---------------------------------------------------
<blockquote>缩排1单位</blockquote> | 缩排1单位
---------------------------------------------------
<blockquote><blockquote>缩排2单位 | 缩排2单位
</blockquote></blockquote> |
---------------------------------------------------
保存原始格式标签:利用<pre></pre>这个标签可以将其包起来的文字排版,
格式，原封不动的呈现出来。处是相当妈用的标签之一。
原始码 | 呈现效果
---------------------------------------------------
<pre> |
文 字 | 文 字
格 式 | 格 式
</pre> |
---------------------------------------------------
MyCode2(4)字体标签
标题标签:标题的大小一共有六种,两个标签一组,也就是从<h1>到<h6>,
<h1>最大,<h6>最小。使用标题标签时，该标签会将字体变成粗体，并
且会自成一行。
原始码 | 呈现效果
---------------------------------------------------
<h1>标题1</h1> |
---------------------------------------------------
<h2>标题1</h2> |
---------------------------------------------------
<h6>标题1</h6> |
---------------------------------------------------
设定字体大小标签：标题的大小一共有七种，也就是<font size=1>(最小)到
<font size=7>(最大),另外，还有一种写法:<font size=+1>文字内容</font>
，其意思就是说：比预设定大一级。当然也可以font size=+2,或是font size=-1
一般而言，预设字体多为3.
字型变化标签：在文字标签里，对于文字的格式也有相当多的变化，如粗体，
斜体。。。等，常用字型 变化标签如下
原始码
-------------------------------
<b>粗体</b>
-------------------------------
<i>斜体</i>
-------------------------------
<u>下划线</u>
-------------------------------
<sup>上标</sup>
-------------------------------
<sub>下标</sub>
-------------------------------
<blink>闪烁</blink>
-------------------------------
文字颜色设定:<font color="#fefech">文字颜色</font>
<font color="#ff0000">红</font>
<font color="#ff8000">橙</font>
<font color="#ffff00">黄</font>
<font color="#00ff00">绿</font>
<font color="#0080ff">蓝</font>
文字字型设定:<font face="字型名称">文字</font>
原始码
---------------------------------------------------
<font face="楷体_GB2312">楷体_GB2312</font>
---------------------------------------------------
特殊字元：很多特殊的符号是需要特别处理的，比如说"<",">"
这两个符号想要呈现在网页上是没有办法直接打"<"的,要呈现
"<"必须输入编码表示法:"<",常用的如下:
原始码 | 呈现效果
---------------------------------------------------
  | 代表珍上不断行空白
---------------------------------------------------
< | <
---------------------------------------------------
> | >
---------------------------------------------------
& | &
---------------------------------------------------
" | '
---------------------------------------------------
设定文字内定值大小:<basefont size="1~7">。这个标签可以改变文字的大小
的内定值，直接加在<body>标签之后就行了。一般而言，文字大小的内定值预
定值为3.
MyCode3
(1)网页架构:主要网页主架构的介绍
(2)分隔标签:也就是所谓的水平线
(3)排版标签:针对标签的属性，可做适当的版面编排
(4)字体标签:教导您设定文字的字体
(5)文字标签:教导你设定文字的颜色，行距，变化等等
(6)影像标签:教导您如何在网页中，植入图像
(7)背景标签:教导您如何设定背景颜色或是背景网像
(8)链接标签：教导您如何设定超链接，以及开视窗的条件
(9)表格标签：教导您如何在网页中运用表格
(10)序列标签：教导您如何设定文字序列或图形序列
(11)表单标签：教导您如何制作可填写用的表单
(12)框架标签：可让同一个视窗同多个网页一起组成
(1)网页架构
<HTML>
<HEAD>
<TITLE>网页制作教学</TITLE>
<Meara>
</HEAD>
<BODY>
BODY之间则为主要语法所在，也是网页的主要呈现部分
</BODY>
</HTML>
(2)分隔标签<HEAD>
<TITLE>网页制作教学</TITLE>
<Meara>
</HEAD>
<BODY>
BODY之间则为主要语法所在，也是网页的主要呈现部分
</BODY>
</HTML>
文字上的分隔标签:强制断行标签<br>
强制分段标签<p>
原始码 | 呈现结果
---------------------------------------------------------------------
这是一个断行的范例<br>看出来了吗 | 这是一个断行的范例
| 看出来了吗
---------------------------------------------------------------------
这是一个分段的范例<p>基本上分段会 | 这是一个分段的范例
比断行还多空出一行 |
| 比断行还多空出一行
---------------------------------------------------------------------
分隔线标签:利用<hr>这个标签便可以产生一条横分隔线
---------------------------------------------------
一般用法 | 尚未加任何属性
---------------------------------------------------
原始码 | 普通他隔线<br>
---------------------------------------------------
呈现结果 | ___________________________
---------------------------------------------------
颜色属性 | 用法<hr color = "颜色码或颜色名称">
---------------------------------------------------
原始码 | 橘色分隔线<hr color="#ff8000">
---------------------------------------------------
呈现结果 | ______________________(橘色分隔线)
---------------------------------------------------
宽度属性 | 用法:<hr width="宽度">，其单位为px(像素)
| 宽度亦可以用百分比不作设定,如50%的意为宽度
| 占屏幕50%
---------------------------------------------------
原始码 | 宽度为240px的分隔线<hr width="240">
---------------------------------------------------
厚度属性 | 用法:<hr size="厚度">
---------------------------------------------------
原始码 | 厚度为5的分隔线<hr size="5">
---------------------------------------------------
位置属性 | 用法:<hr align="水平对齐位置">,其设定值有三个,
| 也就是align="left" align="center" align="right"
---------------------------------------------------
原始码 | 靠右的分隔线<hr align="right">
---------------------------------------------------
阴影属性 ｜ 用法:<hr noshade>,无设定值
---------------------------------------------------
原始码 | 实心分隔(无阴影)<hr noshade>
---------------------------------------------------
注意：除了必要的空格外，最好不要加空格，否则易出错.
这里的宽度指线的长度，而非线的粗细
MyCode1
文字置左,置中,置右:
原始码 | 呈现效果
---------------------------------------------------
<p align="left">文字靠左</p> | 文字靠左
---------------------------------------------------
<p align="center">文字置中</p> | 文字置中
---------------------------------------------------
<p align="right">文字靠右</p> | 文字靠右
---------------------------------------------------
<center>标签 文字置中
原始码 | 呈现效果
---------------------------------------------------
<center>中间</center> | 中间
---------------------------------------------------
向右缩排标签:
<blockquote></blockquote>这个标签可以将其包起来的文字，全部
往右缩排.而且加一组标签，往右缩排一单位,加两组标签，信右缩排两
单位,依此类推
原始码 | 呈现效果
---------------------------------------------------
<blockquote>缩排1单位</blockquote> | 缩排1单位
---------------------------------------------------
<blockquote><blockquote>缩排2单位 | 缩排2单位
</blockquote></blockquote> |
---------------------------------------------------
保存原始格式标签:利用<pre></pre>这个标签可以将其包起来的文字排版,
格式，原封不动的呈现出来。处是相当妈用的标签之一。
原始码 | 呈现效果
---------------------------------------------------
<pre> |
文 字 | 文 字
格 式 | 格 式
</pre> |
---------------------------------------------------
MyCode2标题标签:标题的大小一共有六种,两个标签一组,也就是从<h1>到<h6>,
<h1>最大,<h6>最小。使用标题标签时，该标签会将字体变成粗体，并
且会自成一行。
原始码 | 呈现效果
---------------------------------------------------
<h1>标题1</h1> |
---------------------------------------------------
<h2>标题1</h2> |
---------------------------------------------------
<h6>标题1</h6> |
---------------------------------------------------
设定字体大小标签：标题的大小一共有七种，也就是<font size=1>(最小)到
<font size=7>(最大),另外，还有一种写法:<font size=+1>文字内容</font>
，其意思就是说：比预设定大一级。当然也可以font size=+2,或是font size=-1
一般而言，预设字体多为3.
字型变化标签：在文字标签里，对于文字的格式也有相当多的变化，如粗体，
斜体。。。等，常用字型 变化标签如下
原始码
-------------------------------
<b>粗体</b>
-------------------------------
<i>斜体</i>
-------------------------------
<u>下划线</u>
-------------------------------
<sup>上标</sup>
-------------------------------
<sub>下标</sub>
-------------------------------
<blink>闪烁</blink>
-------------------------------
文字颜色设定:<font color="#fefech">文字颜色</font>
<font color="#ff0000">红</font>
<font color="#ff8000">橙</font>
<font color="#ffff00">黄</font>
<font color="#00ff00">绿</font>
<font color="#0080ff">蓝</font>
文字字型设定:<font face="字型名称">文字</font>
原始码
---------------------------------------------------
<font face="楷体_GB2312">楷体_GB2312</font>
---------------------------------------------------
特殊字元：很多特殊的符号是需要特别处理的，比如说"<",">"
这两个符号想要呈现在网页上是没有办法直接打"<"的,要呈现
"<"必须输入编码表示法:"<",常用的如下:
原始码 | 呈现效果
---------------------------------------------------
  | 代表珍上不断行空白
---------------------------------------------------
< | <
---------------------------------------------------
> | >
---------------------------------------------------
& | &
---------------------------------------------------
" | '
---------------------------------------------------
设定文字内定值大小:<basefont size="1~7">。这个标签可以改变文字的大小
的内定值，直接加在<body>标签之后就行了。一般而言，文字大小的内定值预
定值为3.
MyCode3
浙公网安备 33010602011771号