📄 html4.htm
字号:
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb_2312-80">
<META NAME="Generator" CONTENT="Microsoft Word 97">
<TITLE>HTML语言教程之四:图像(IMAGE)标记</TITLE>
<META NAME="Template" CONTENT="C:\PROGRAM FILES\MICROSOFT OFFICE\OFFICE\html.dot">
<link rel="stylesheet" href="../../cpcw.css"></HEAD>
<BODY LINK="#0000ff" VLINK="#800080" background="../bg.gif">
<table width="85%" border="0" align="center">
<tr bgcolor="#FFFFFF">
<td>
<p align="CENTER"><font size="6" lang="ZH-CN"><font color="#FF3333" class="title"><b>HTML语言教程之四:图像(IMAGE)标记</b></font></font></p>
<p align="JUSTIFY"></p>
<hr>
<p> </p>
<h2> 链入图象的基本语法</h2>
<p><!------img source-------></p>
<h3><img src=#> #=图象的 URL</h3>
<p><!------img description-------></p>
<h3><img alt=#> <br>
<font size=+0>#=在浏览器尚未完全读入图象时,在图象位置显示的文字。</font></h3>
<dl>
<dd><tt><img src="f.gif" alt="MY FACE :-)">
</tt></dd>
</dl>
<p><img src="f.gif" alt="MY FACE :-)" height=64 width=64> </p>
<pre>
</pre>
<p><!--################## Image aligned with Text ########################--><a name="text"></a></p>
<h2> 图象和文字的对齐</h2>
<h3><img align=#> #=top, middle, bottom</h3>
<dl>
<dd><tt><img src=URL align=top> My face! </tt></dd>
</dl>
<p><img src="f.gif" alt="(^_^)" height=64 width=64 align=TOP> My Face! </p>
<dl>
<dd><tt><img src=URL align=middle> My face! </tt></dd>
</dl>
<p><img src="f.gif" alt="(^_^)" height=64 width=64 align=CENTER> My Face!
</p>
<dl>
<dd><tt><img src=URL align=bottom> My face! </tt></dd>
</dl>
<p><img src="f.gif" alt="(^_^)" height=64 width=64 align=BOTTOM> My Face!
</p>
<ul>
<li>只有一行文字才可以放在图象的两边。(不知道翻译的对不对?)</li>
<li>Only one text line can be flown into the both side of Image. </li>
</ul>
<pre>
</pre>
<p><!--################## Floating Image ########################--><a name="float"></a></p>
<h2> 图象在页面中的对齐/布局(Floating Image) </h2>
<p><!------img align=left-------></p>
<h3><b><img align=left></b></h3>
<dl>
<dd><tt><img src=URL align=left>My Face!<br><br>
It is always<br><br>
smiling.<br><br>
Hahaha....<br></tt><br>
</dd>
</dl>
<p><img src="f.gif" alt="(^_^)" height=64 width=64 align=LEFT>My Face!<br>
It is always<br>
smiling.<br>
Hahaha....<br>
<br clear=all>
</p>
<pre>
</pre>
<p><!------img align=right-------></p>
<h3><b><img align=right></b></h3>
<p><img src="f.gif" alt="(^_^)" height=64 width=64 align=RIGHT>My Face!<br>
It is always<br>
smiling.<br>
Hahaha....<br>
<br clear=all>
</p>
<pre>
</pre>
<p><!------br clear-------></p>
<h3><b><br clear=all></b></h3>
<dl>
<dd><tt><img src=URL align=left>My Face!<br><br>
It is always<br>
<br clear=all><br>
smiling.<br><br>
Hahaha....<br></tt><br>
</dd>
</dl>
<p><img src="f.gif" alt="(^_^)" height=64 width=64 align=LEFT>My Face!<br>
It is always<br>
<br clear=all>
smiling.<br>
Hahaha....</p>
<p> </p>
<pre>
</pre>
<p><!------vspace hspace-------></p>
<h3><b><img vspace=# hspace=#> #=value</b></h3>
<dl>
<dd><tt><img src=URL align=left vspace=10 hspace=20>My Face!<br><br>
It is always<br><br>
smiling.<br><br>
Hahaha....<br></tt><br>
</dd>
</dl>
<p><img src="f.gif" alt="(^_^)" hspace=20 vspace=10 height=64 width=64 align=LEFT>My
Face!<br>
It is always<br>
smiling.<br>
Hahaha....<br>
<br clear=all>
</p>
<pre>
</pre>
<p><!--################## Border ########################--><a name="border"></a></p>
<h2> 边框</h2>
<p><!------border-------></p>
<h3><b><img border=#> #=value</b></h3>
<dl>
<dd><tt><a href="URL"><br>
<img src=URL border=15><br>
</a> </tt></dd>
</dl>
<h2><blink><a href="fh.gif"><img src="fh.gif" alt="(^_^)" border=15 height=64 width=64></a>
</blink></h2>
<p align="CENTER"><a href="html1.htm">页面标记|</a>
<a href="html2.htm">字体标记|</a>
<a href="html3.htm">文字布局|</a>
<a href="html4.htm">图像标记|</a>
<a href="html5.htm">表单标记|</a>
<a href="html6.htm">表格标记|</a>
<a href="html7.htm">表格进阶|</a>
<a href="html8.htm">多窗口|</a>
<a href="html9.htm">移动文字|</a>
<a href="html10.htm">多媒体</a><br>
<a href="html3.htm">上一节</a> <a href="start.html">首页</a> <a href="html5.htm">下一节</a></p>
</td>
</tr>
</table>
</BODY>
</HTML>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -