0039.htm
来自「新时代软件教程:操作系统 主页制作 服务器 设计软件 网络技术 编程语言 文字编」· HTM 代码 · 共 354 行
HTM
354 行
<html>
<head>
<title>新时代软件教程:操作系统 主页制作 服务器 设计软件 网络技术 编程语言 文字编辑</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
<!--
body, table {font-size: 9pt; font-family: 宋体}
a {text-decoration:none}
a:hover {color: red;text-decoration:underline}
.1 {background-color: rgb(245,245,245)}
-->
</style>
</head>
<p align="center"><script src="../../1.js"></script></a>
<p align="center"><big><strong>文字布局</strong></big></p>
<div align="right">---摘自《网页设计师》</div>
<font color="#008000"><nobr>◇</nobr> 行的控制</font>
<p>
段(Paragraph) (可以看作是空行) <p></p>
<dl>
<dd><tt>你好吗？<p>很好。</tt></dd>
</dl>
<p>你好吗？</p>
<p>很好。</p>
<p><!------Break Line------->
换行 <br>
<dl>
<dd><tt>你好吗？<br>很好。</tt></dd>
</dl>
<p>你好吗？<br>
很好。</p>
不换行<nobr>
<dl>
<dd><tt><nobr><br>
请改变您浏览器窗口的宽度，
使之小于这一行的宽度， 看看这个标记的作用！<br>
</nobr></tt></dd>
</dl>
<p><nobr>请改变您浏览器窗口的宽度，使之小于这一行的宽度，看看这个标记的作用！</p>
<font color="#008000">◇ 文字的对齐(Alignment)</font>
<p><!------hn centering------->
<hn align=#>...</hn><br>
<p align=#>...</p> #=left, center, right
<dl>
<dd><tt><h3 align=center>Hello<\h3><br>
<h3 align=right>Hello<\h3></tt></dd>
</dl>
<h3 align="center">Hello
</h3>
<h3 align="right">Hello
</h3>
<p><!------centering------->
<center>...</center>
<dl>
<dd><tt><center>Hello</center></tt></dd>
</dl>
<p align="center">Hello</p>
<p><!--################## Division ########################-->
<a name="division"></a>◇ 文字的分区(Division)显示</p>
<p><!------left------->
<div align=left> ... </div>
<dl>
<dd><tt><div align=left><br>
Can you feel happiness without unpleasant? <br><br>
Please show me your smile.<br>
</div></tt></dd>
</dl>
<p>Can you feel happiness without unpleasant?<br>
Please show me your smile. <!------center------->
</p>
<div align=center> ... </div>
<p align="center">Can you feel happiness without unpleasant?<br>
Please show me your smile. <!------right------->
</p>
<div align=right> ... </div>
<p align="right">Can you feel happiness without unpleasant?<br>
Please show me your smile.</p>
<font color="#008000">◇ 列表</font>
<p><!------Unordered List------->
无序列表 <ul><li>...</ul>
<dl>
<dd><tt><ul><br>
<li>Today<br>
<li>Tommorow<br>
</ul></tt></dd>
</dl>
<ul>
<li>Today
<li>Tommorow</li>
</ul>
<p><!------Ordered List------->
有序列表 <ol><li>...</ol>
<dl>
<dd><tt><ol><br>
<li>Today<br>
<li>Tommorow<br>
</ol></tt></dd>
</dl>
<ol>
<li>Today
<li>Tommorow</li>
</ol>
<p><!------Definition List------->
定义列表(Definition lists)
<dl><dt>...<dd>...</dl>
<dl>
<dd><tt><dl><br>
<dt>Today<br>
<dd>Today is yesterday.<br>
<dt>Tomorrow<br>
<dd>Tomorrow is today.<br>
</dl></tt></dd>
</dl>
<dl>
<dt>Today
<dd>Today will be yesterday.
<dt>Tomorrow
<dd>Tomorrow will be today.</dd>
</dl>
<p><!------Definition List Compact------->
Definition lists Compact <dl
compact><dt>...<dd>...</dl></p>
<table width="100%">
<tbody>
<tr>
<td width="50%">
<dl compact>
<dt>Today
<dd>Today will be yesterday.
<dt>Next
<dd>Tomorrow will be today.</dd>
</dl>
</td>
<td><tt><dl compact><br>
<dt>Today<br>
<dd>Today is yesterday.<br>
<dt>Tomorrow<br>
<dd>Tomorrow is today.<br>
</dl></tt></td>
</tr>
</tbody>
</table>
<font color="#008000">◇ 定制列表元素</font>
<p><!------Mark Style------->
定制表中的标记 <li type=#> #=disk, circle, square
<dl>
<dd><tt><ul><br>
<li type=disc>ONE<br>
<li type=circle>TWO<br>
<li type=square>THREE<br>
</ul></tt></dd>
</dl>
<ul>
<li type="disc">ONE
<li type="circle">TWO
<li type="square">THREE</li>
</ul>
<p><!------Capital letters------->
</p>
<font color="#008000">定制有序列表表中的序号 <li
type=#> #=A, a, I, i, 1</font>
<dl>
<dd><tt><ol><li type=A>ONE-ONE<br>
<li>ONE-TWO</ol></tt>
<ol>
<li type="A">ONE-ONE
<li>ONE-TWO</li>
</ol>
<dd><tt><ol><li type=a>ONE-ONE<br>
<li>ONE-TWO</ol></tt>
<ol>
<li type="a">ONE-ONE
<li>ONE-TWO</li>
</ol>
<dd><tt><ol><li type=I>ONE-ONE<br>
<li>ONE-TWO</ol></tt>
<ol>
<li type="I">ONE-ONE
<li>ONE-TWO</li>
</ol>
<dd><tt><ol><li type=i>ONE-ONE<br>
<li>ONE-TWO</ol></tt>
<ol>
<li type="i">ONE-ONE
<li>ONE-TWO</li>
</ol>
<dd><tt><ol><li type=1>ONE-ONE<br>
<li>ONE-TWO</ol></tt>
<ol>
<li type="1">ONE-ONE
<li>ONE-TWO</li>
</ol>
</dd>
</dl>
<p><!------Sarted Number------->
定制有序列表表中的序号的起始值 <ol start=#> #=number
<dl>
<pre><ol start=5>
<li type=A>ONE-ONE
<li>ONE-TWO
<ol start=10>
<li>TWO-ONE
<li type=i>TWO-TWO
</ol></ol>
</pre>
</dl>
<ol start="5">
<li type="A">ONE-ONE
<li>ONE-TWO
<ol start="10">
<li>TWO-ONE
<li type="i">TWO-TWO</li>
</ol>
</li>
</ol>
<p><!--################## Preformatted ########################-->
<a name="pre"></a><font color="#008000">◇ 预格式化文本(Preformatted
Text)</font></p>
<p><!------Preformatted------->
<pre>...</pre>
<dl>
<dd><tt><pre><br>
Please use your card.<br>
VISA Master<br>
<b>Here is an order form.</b><br>
<ul><li>Fax<br>
<li>Air Mail</ul><br>
</pre></tt></dd>
</dl>
<pre>Please use your card
VISA Master
<b>Here is an order form.</b>
</pre>
<ul>
<li>Fax
<li>Air Mail</li>
</ul>
<p><!------Listing------->
</p>
<listing>...</listing>
<dl>
<dd><tt><listing><br>
Please use your card.<br>
VISA Master<br>
<b>Here is an order form.</b><br>
<ul><li>Fax<br>
<li>Air Mail</ul><br>
</listing></tt></dd>
</dl>
<pre>Please use your card.
VISA Master
<b>Here is order form.</b>
</pre>
<ul>
<li>Fax
<li>Air Mail</li>
</ul>
<p><!------Example------->
</p>
<xmp>...</xmp>
<dl>
<dd><tt><xmp><br>
Please use your card.<br>
VISA Master<br>
<b>Here is an order form.</b><br>
<ul><li>Fax<br>
<li>Air Mail</ul><br>
</xmp></tt></dd>
</dl>
<pre>Please use your card.
VISA Master
<b>Here is order form.</b>
<ul><li>Fax
<li>Air Mail</ul>
<a name="spacer"></a></pre>
<font color="#008000">◇ 空白(Spacer)</font> <img alt="netscape.gif (168 bytes)" height="14" src="images/netscape.gif" width="80">
<p><!------h&R------->
<spacer type="horizontal" size=#> #=水平空白宽度<br>
<spacer type="vertical" size=#> #=竖直空白高度
<dl>
<dd><tt>YESTERDAY <spacer type="horizontal" size=50> TODAY<br>
<spacer type="vertical" size=50> TOMORROW</tt></dd>
</dl>
<p>YESTERDAY <SPACER size="50" type="horizontal">
TODAY <SPACER size="50"
type="vertical">
TOMORROW</p>
<p><!------BLOCK------->
<spacer type="block" width=# height=# align=##><br>
#=空白的尺寸<br>
##=top, middle, bottom, left, right
<dl>
<dd><tt><spacer type="block" width=150 height=50
align=left><br>
YESTERDAY<br> TODAY<br> TOMORROW</tt></dd>
</dl>
<p><SPACER type="block" align="left" height="50"
width="150">
YESTERDAY<br>
TODAY<br>
TOMORROW</p>
<font color="#008000">◇ 多列文本</font> <img alt="netscape.gif (168 bytes)" height="14" src="images/netscape.gif" width="80">
<p><!------Basic------->
<multicol cols=#> ... </multicol> #=列的数目
<dl>
<dd><tt><multicol cols=2> text text text... </multicol><br>
</tt><a href="../../www.gzsums.edu.cn/webclass/html/samp/multicol01.html">例子</a></dd>
</dl>
<p><!------GUTTER------->
<multicol gutter=#> ... </multicol> #=列间的空白
<dl>
<dd><tt><multicol cols=2 gutter=100> text text text...
</multicol><br>
</tt><a href="../../www.gzsums.edu.cn/webclass/html/samp/multicol02.html">例子</a></dd>
</dl>
<multicol width=#> ... </multicol> #=列的宽度
<dl>
<dd><tt><multicol cols=2 width=400> text text text...
</multicol><br>
</tt><a href="../../www.gzsums.edu.cn/webclass/html/samp/multicol03.html">例子</a></dd>
</dl>
<font color="#008000">◇ 其它</font>
<p><!------BLOCKQUOTE------->
块引用(Blockquote) <blockquote>...</blockquote>
<dl>
<dd><tt>Her Song:<br>
<blockquote><br>
When I was young, I listened to the radio<br>
waiting for my favorite songs....<br>
</blockquote></tt></dd>
</dl>
<p>Her Song:</p>
<blockquote>
<p>When I was young, I listened to the radio waiting for my favorite
songs....</p>
</blockquote>
闪烁 <blink>...</blink>
<dl>
<dd><tt><BLINK> 闪烁！闪烁！ </BLINK></tt></dd>
</dl>
<p><blink>闪烁！闪烁！(已取消)</blink></p>
</nobr>
<p> </p>
<p>(未完，请继续)
</table>
<p align="center"><script src="../../2.js"></script></a>
</body>
</html>⌨️ 快捷键说明
复制代码Ctrl + C
搜索代码Ctrl + F
全屏模式F11
增大字号Ctrl + =
减小字号Ctrl + -
显示快捷键?