如何使用HTML排版标签——作者：星星点灯

删除

版主

Rank: 7 Rank: 7 Rank: 7

1^# 大中小发表于 2002-10-19 21:30 只看该作者

如何使用HTML排版标签——作者：星星点灯

如何使用HTML排版标签我们在用word等字处理软件书写文章时，为了使页面布局美观，系统都自带了许多排版的功能，利用这些功能我们可以把文章排得非常整齐，易于阅读。同样，在制作网页时，为了美化页面、方便排版，在HTML语言中也设计了许多简单易用的排版标签，灵活应用这些标签，就可以让你设计出精彩的网页来。一、段落和换行标签 ①

该标签的作用是换行，另起一个新的段落。它可以单独使用，也可以

……

联合使用。使用了

标签后，两个段落之间会空出一行。 ②
该标签的作用是在文本后面插入一个硬换行符，它仅仅用来使文本换行页不需要与前一行文本之间空出一行，这是它与

标签的一个最大区别。
标签既可以放在同一行文本的后面，也可以独自放在一行上，其结果是相同的。 ③…… 该标签用来防止浏览器将URL之类的文本行断开。因为对于一个行较长的文本，无论你是否在其中使用

或
标签，如果它的长度超过了浏览器窗口的宽度，浏览器都会自动将它们\换行显示。如果你不允许将文本断开时，就可以使用……标签，这样浏览器就会将和之间的文本内容放在一行内显示。二、预定义文本格式标签 ①

……

该标签用于保持文本正文中的间隔和换行格式，如果你想要在网页上让整段文字以预先编排好的格式显示出来，就可以先用文本编辑器预先编排好，然后在整段文字的首尾加上

……

标签即可。浏览时就可以按照你排好的格式显示。 ②…… 该标签用来显示位于其中的所有文本内容和文本格式及间隔，包括位于其中的HTML标签，这对于排版显示HTML文本特别有用。图1是

和标签的显示效果图。 
③<LISTING>……</LISTING> 
该标签用等宽字体来显示位于其中的文本，就像是老式打字机或者是计算机打印出来的文本。 
三、居中显示标签 
<CENTER>……</CENTER> 
该标签可使文本或图像在浏览器窗口居中放置，而且它还随着浏览器窗口的变大变小而自动的调整居中位置。它非常适合于有多个连在一起的段落需要居中排列的场合，这样可省去对每一个段落都分别设置居中属性的麻烦。 
下面一段文本的显示效果见图2。 
<html> 
<head> 
<title>示例</title> 
</head> 
<body> 
<center> 
<pre> 
床前明月光 
疑是地上霜 
举头望明月 
低头思故乡 
</pre>> 
</center> 
</body> 
</html> 
四、分区显示标签 <DIV>……</DIV> 
该标签用于分区显示文本段落，使页页排版美观。它具有align属性，使用方法是：<div align=#>……<div>，#是属性值，有三个选项：left（左对齐）、center（居中）、rigth（右对齐）。 
……本文转载自宇风<span href="tag.php?name=%B6%E0%C3%BD%CC%E5" onclick="tagshow(event)" class="t_tag">多媒体</span>论坛原<span href="tag.php?name=%D4%AD%B4%B4" onclick="tagshow(event)" class="t_tag">原创</span>版块，作者：星星点灯</div>

							
							
							
													</div>
															</div>
			</td>
		</tr>
		<tr>
			<td class="postauthor">
								<div class="popupmenu_popup userinfopanel" id="userinfo573166_menu" style="display: none;">
										<dl><dt>UID</dt><dd>107578&nbsp;</dd><dt>帖子</dt><dd>1516&nbsp;</dd><dt>精华</dt><dd><a href="digest.php?authorid=107578">0</a>&nbsp;</dd><dt>积分</dt><dd>4122&nbsp;</dd><dt>阅读权限</dt><dd>100&nbsp;</dd><dt>来自</dt><dd>等待&nbsp;</dd><dt>在线时间</dt><dd>0 小时&nbsp;</dd><dt>注册时间</dt><dd>2002-10-17&nbsp;</dd><dt>最后登录</dt><dd>2008-1-20&nbsp;</dd></dl>
											<p><a href="http://www.aiclub.cn" target="_blank">查看个人网站</a></p>
										<p><a href="space.php?action=viewpro&amp;uid=107578" target="_blank">查看详细资料</a></p>
									</div>
							</td>
			<td class="postcontent">
				<div class="postactions">
										<p>
																																																<strong onclick="scroll(0,0)" title="顶部">TOP</strong>
					</p>
					<div id="ad_thread1_0"></div>
				</div>
			</td>
		</tr>
		</table>
		</div>
</form>

<div class="pages_btns">
	<div class="threadflow"><a href="redirect.php?fid=43&amp;tid=91008&amp;goto=nextoldset"> &lsaquo;&lsaquo; 上一主题</a> | <a href="redirect.php?fid=43&amp;tid=91008&amp;goto=nextnewset">下一主题 &rsaquo;&rsaquo;</a></div>
				<span class="postbtn" id="newspecialtmp" onmouseover="$('newspecial').id = 'newspecialtmp';this.id = 'newspecial';showMenu(this.id)"><a href="post.php?action=newthread&amp;fid=43&amp;extra=page%3D1"><img src="images/default/newtopic.gif" border="0" alt="发新话题" title="发新话题" /></a></span>
		<span class="replybtn"><a href="post.php?action=reply&amp;fid=43&amp;tid=91008&amp;extra=page%3D1"><img src="images/default/reply.gif" border="0" alt="" /></a></span></div>

	<div class="popupmenu_popup" id="forumlist_menu" style="display: none">
		<dl><dt><a href="index.php?gid=58">互动多媒体·AIR·Web ·E-Learning技术讨论区</a></dt><dd><ul><li><a href="forum-1-1.html">Authorware论坛</a></li><li class="sub"><a href="forum-23-1.html">Authorware常见问题</a></li><li class="sub"><a href="forum-26-1.html">Authorware扩展与开发</a></li><li class="sub"><a href="forum-27-1.html">Authorware源程序交流</a></li><li class="sub"><a href="forum-25-1.html">Authorware教程资源</a></li><li><a href="forum-2-1.html">Director论坛</a></li><li class="sub"><a href="forum-37-1.html">Adobe Director 11</a></li><li class="sub"><a href="forum-55-1.html">课件苑地</a></li><li class="sub"><a href="forum-36-1.html">Director作品交流</a></li><li class="sub"><a href="forum-35-1.html">Director扩展与开发</a></li><li class="sub"><a href="forum-41-1.html">Director教程资源</a></li><li><a href="forum-3-1.html">Flash论坛</a></li><li class="sub"><a href="forum-38-1.html">Flash常见问题</a></li><li class="sub"><a href="forum-47-1.html">Flash源程序交流</a></li><li class="sub"><a href="forum-24-1.html">Flash教程资源</a></li><li><a href="forum-46-1.html">课件制作</a></li><li><a href="forum-9-1.html">网页设计</a></li><li class="sub current""><a href="forum-43-1.html">网站建设教程资源</a></li><li><a href="forum-14-1.html">MMB论坛</a></li><li><a href="forum-45-1.html">虚拟现实</a></li><li><a href="forum-10-1.html">AIR论坛</a></li></ul></dd></dl><dl><dt><a href="index.php?gid=63">视觉艺术 CG动画 视频 后期</a></dt><dd><ul><li><a href="forum-4-1.html">影视制作</a></li><li class="sub"><a href="forum-29-1.html">影视制作教程资源</a></li><li class="sub"><a href="forum-56-1.html">Vegas论坛</a></li><li class="sub"><a href="forum-31-1.html">影视制作常见问题</a></li><li class="sub"><a href="forum-30-1.html">滤镜效果</a></li><li><a href="forum-7-1.html">三维动画</a></li><li class="sub"><a href="forum-15-1.html">三维动画教程资源</a></li><li><a href="forum-6-1.html">编码刻录</a></li><li><a href="forum-5-1.html">摄影摄像</a></li><li><a href="forum-8-1.html">平面设计</a></li><li class="sub"><a href="forum-11-1.html">界面设计</a></li><li class="sub"><a href="forum-40-1.html">手绘园地</a></li><li class="sub"><a href="forum-32-1.html">设计酷评</a></li><li class="sub"><a href="forum-39-1.html">Photoshop论坛</a></li><li class="sub"><a href="forum-53-1.html">CorelDraw论坛</a></li><li><a href="forum-12-1.html">音频处理</a></li><li class="sub"><a href="forum-54-1.html">教程资源</a></li><li><a href="forum-22-1.html">社区竞技场</a></li></ul></dd></dl><dl><dt><a href="index.php?gid=64">电脑技术 基础应用</a></dt><dd><ul><li><a href="forum-42-1.html">办公软件</a></li><li><a href="forum-50-1.html">硬件园地</a></li><li><a href="forum-13-1.html">操作系统</a></li></ul></dd></dl><dl><dt><a href="index.php?gid=61">社区杂谈</a></dt><dd><ul><li><a href="forum-17-1.html">风铃茶楼</a></li><li class="sub"><a href="forum-34-1.html">真我风采</a></li><li class="sub"><a href="forum-48-1.html">网友聚会</a></li><li class="sub"><a href="forum-33-1.html">创业之道</a></li><li class="sub"><a href="forum-51-1.html">社区原创</a></li><li class="sub"><a href="forum-44-1.html">投票中心</a></li><li><a href="forum-16-1.html">业界风云</a></li><li><a href="forum-19-1.html">招聘与求职</a></li><li><a href="forum-18-1.html">广告与交易</a></li></ul></dd></dl><dl><dt><a href="index.php?gid=62">站务管理</a></dt><dd><ul><li><a href="forum-20-1.html">共建论坛</a></li></ul></dd></dl>	</div>

<script type="text/javascript">
var maxpage = 1;
if(maxpage > 1) {
	document.onkeyup = function(e){
		e = e ? e : window.event;
		var tagname = is_ie ? e.srcElement.tagName : e.target.tagName;
		if(tagname == 'INPUT' || tagname == 'TEXTAREA') return;
		actualCode = e.keyCode ? e.keyCode : e.charCode;
					}
}
</script>

</div>

	<ul class="popupmenu_popup headermenu_popup" id="memcp_menu" style="display: none">
		<li><a href="memcp.php">控制面板首页</a></li>
		<li><a href="memcp.php?action=profile">编辑个人资料</a></li>
				<li><a href="memcp.php?action=creditslog">积分记录</a></li>
		<li><a href="memcp.php?action=usergroups">公众用户组</a></li>
			<li><a href="memcp.php?action=spacemodule" target="_blank">个人空间管理</a></li>
				<li><a href="http://blog.yfdmt.com/?uid/0" target="_blank">升级个人空间</a></li>
		</ul>
	<ul class="popupmenu_popup headermenu_popup" id="stats_menu" style="display: none">
		<li><a href="stats.php">基本概况</a></li>
					<li><a href="stats.php?type=views">流量统计</a></li><li><a href="stats.php?type=agent">客户软件</a></li><li><a href="stats.php?type=posts">发帖量记录</a></li>
				<li><a href="stats.php?type=forumsrank">版块排行</a></li><li><a href="stats.php?type=threadsrank">主题排行</a></li><li><a href="stats.php?type=postsrank">发帖排行</a></li><li><a href="stats.php?type=creditsrank">积分排行</a></li>
		<li><a href="stats.php?type=trade">交易排行</a></li>
		<li><a href="stats.php?type=onlinetime">在线时间</a></li>		<li><a href="stats.php?type=team">管理团队</a></li>
		<li><a href="stats.php?type=modworks">管理统计</a></li>	</ul>

<div id="ad_footerbanner1"></div><div id="ad_footerbanner2"></div><div id="ad_footerbanner3"></div>

<div id="footer">
	<div class="wrap">
		<div id="footlinks">
			<p>当前时区 GMT+7, 现在时间是 2008-12-2 13:51</p>
			<p>
				<a href="member.php?action=clearcookies&amp;formhash=43a17e3f">清除 Cookies</a>
				- <a href="http://www.yfdmt.com/serve/index.html">项目承接</a> - <a href="http://peiyin.yfdmt.net">配音服务</a> - <a href="http://www.yfdmt.net/company.aspx">上榜企业</a> - <a href="http://www.yfdmt.com/" target="_blank">宇风多媒体</a>
				 - <a href="archiver/" target="_blank">Archiver</a>				 - <a href="wap/" target="_blank">WAP</a>				- <span class="scrolltop" onclick="window.scrollTo(0,0);">TOP</span>
									- <span id="styleswitcher" class="dropmenu" onmouseover="showMenu(this.id)">界面风格</span>
					<script type="text/javascript">
					function setstyle(styleid) {
											location.href = 'viewthread.php?tid=91008&page=1&styleid=' + styleid;
										}
					</script>
					<div id="styleswitcher_menu" class="popupmenu_popup" style="display: none;">
					<ul><li class="current"><a href="###" onclick="setstyle(1)">默认风格</a></li><li><a href="###" onclick="setstyle(2)">喝彩奥运</a></li><li><a href="###" onclick="setstyle(3)">深邃永恒</a></li><li><a href="###" onclick="setstyle(4)">粉妆精灵</a></li><li><a href="###" onclick="setstyle(5)">诗意田园</a></li><li><a href="###" onclick="setstyle(6)">春意盎然</a></li></ul>
					</div>
							</p>
		</div>

		<a href="http://www.discuz.net" target="_blank" title="Powered by Discuz!"><img src="images/default/discuz_icon.gif" border="0" alt="Discuz!" /></a>
		<p id="copyright">
			Powered by <strong><a href="http://www.discuz.net" target="_blank">Discuz!</a></strong> <em>6.0.0</em>			&copy; 1999-2008 <a href="http://www.yfdmt.com" target="_blank">yfdmt.com</a>
		</p>			<p id="debuginfo">Processed in 0.073790 second(s), 9 queries.</p>
			</div>
</div>
<div style="display: none" id="ad_none">
<div id="ad_headerbanner_none"><a href=http://www.yfdmt.cn/reg.asp target=_blank><img src=http://www.yfdmt.com/image/logo/yfcn-468-2.gif border=0></a></div>
						<div class="ad_textlink1" id="ad_thread1_0_none"><a href="http://www.yfdmt.cn/qingdao" target="_blank"青岛·建筑三维动画·虚拟现实·Flash卡通动画·CG动画制作</a></div>
			<div class="ad_textlink2" id="ad_thread2_0_none"></div>
			<div class="ad_pip" id="ad_thread3_0_none"><script type="text/javascript"><!--
google_ad_client = "pub-7092705619553747";
/* 200x200, 创建于 08-11-24 */
google_ad_slot = "1536299693";
google_ad_width = 200;
google_ad_height = 200;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script></div>
				<div class="ad_column" id="ad_interthread_none"></div>
<div class="ad_footerbanner" id="ad_footerbanner1_none"><div align="center"><a href="http://www.yfdmt.com/serve/info/multimedia-carte.htm" target="_blank"><font color="#FF0000">多媒体制作报价</font></a> <a href="http://www.yfdmt.com/serve/info/animate-carte.htm" target="_blank"><font color="#FF0000">三维建筑动画报价</font></a> <a href="http://www.yfdmt.com/serve/info/flash-carte.htm" target="_blank"><font color="#FF0000">Flash动画报价</font></a> <a href="http://www.yfdmt.com/serve/info/veditor-carte.htm" target="_blank"><font color="#FF0000">影视制作报价</font></a> <a href="http://www.yfdmt.com/serve/info/vrml-carte.htm" target="_blank"><font color="#FF0000">虚拟现实报价</font></a> <a href="http://www.yfdmt.com/serve/info/web-carte.htm" target="_blank"><font color="#FF0000">网站制作报价</font></a> <a href="http://yfdmt.com/serve/info/carte.htm" target="_blank"><font color="#FF0000">课件制作报价 </font></a><a href="http://www.yfdmt.com/serve/music/carte.htm" target="_blank"><font color="#FF0000">配音报价</font></a> <a href="http://www.yfdmt.com/webmedia/myhome/index.htm" target="_blank"><font color="#FF0000">域名主机报价</font></a></div></td>
  </tr>
  <tr>
    <td height="90"> <script type="text/javascript"><!--
google_ad_client = "pub-7092705619553747";
google_alternate_ad_url = "http://www.yfdmt.com/image/yf728x90.asp";
google_ad_width = 728;
google_ad_height = 90;
google_ad_format = "728x90_as";
google_ad_type = "text_image";
google_ad_channel = "";
//-->
</script>
<script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script></td>
  </tr>
</table></div>
<div class="ad_footerbanner" id="ad_footerbanner2_none"></div>
<div class="ad_footerbanner" id="ad_footerbanner3_none"><script src='http://ad.icpcn.com/js/728X90_1.js' type='text/javascript'></script></div>
</div>
<script type="text/javascript">
	var insenz_status = 0;
	var insenz_availableadvs = {'headerbanner' : '1', 'thread3_0' : '2', 'thread2_0' : '3', 'thread1_0' : '4', 'interthread' : '5', 'footerbanner1' : '6', 'footerbanner2' : '7', 'footerbanner3' : '8'};
	var insenz_adkeys = [];
	var ad_divs = $('ad_none').getElementsByTagName('div');
	var insenz_cookie = document.cookie.indexOf('insenz_cookie') == -1 ? null : getcookie('insenz_cookie');
	var ad_obj = null;

	if(!insenz_status || insenz_cookie) {
		for(var i = 0; i < ad_divs.length; i++) {
			if(ad_divs[i].id.substr(0, 3) == 'ad_' && (ad_obj = $(ad_divs[i].id.substr(0, ad_divs[i].id.length - 5))) && ad_divs[i].innerHTML) {
				if(insenz_cookie) {
					re = new RegExp(insenz_availableadvs[ad_divs[i].id.substr(3, ad_divs[i].id.length - 8)] + "\:(0" + "|" + gid + "|" + fid + ")", "ig");
					if(re.exec(insenz_cookie) != null) continue;
				}
				ad_obj.innerHTML = ad_divs[i].innerHTML;
				ad_obj.className = ad_divs[i].className;
			}
		}
	}
</script>


<script type="text/javascript">
	if(insenz_status) {
		if(typeof insenz_usedadkeys != 'undefined' && typeof insenz_advs != 'undefined' && insenz_usedadkeys.length && insenz_advs.length) {
			insenz_cookie = '';
			for(var j in insenz_advs) {
				for(var k in insenz_advs[j]) {
					insenz_cookie += j + ':' + k + 'D';
				}
			}
			setcookie('insenz_cookie', insenz_cookie, 86400);
		} else {
			insenz_cookie = 1;
			setcookie('insenz_cookie', '', -86400);
			var insenz_usedadkeys = new Array();
		}
		if(insenz_cookie) {
			for(var i = 0; i < ad_divs.length; i++) {
				if(ad_divs[i].id.substr(0, 3) == 'ad_' && (ad_obj = $(ad_divs[i].id.substr(0, ad_divs[i].id.length - 5))) && ad_divs[i].innerHTML && !in_array(insenz_availableadvs[ad_divs[i].id.substr(3, ad_divs[i].id.length - 8)], insenz_usedadkeys)) {
					ad_obj.innerHTML = ad_divs[i].innerHTML;
					ad_obj.className = ad_divs[i].className;
				}
			}
		}
	}
	$('ad_none').parentNode.removeChild($('ad_none'));
</script>

</body>
</html><script src="include/javascript/msn.js" type="text/javascript"></script>