转关于水平线和center标签和pre预格式化

很明显，第一段中是默认的居左显示，而且源文件中的手动换行都是不起效的，第二段与第一段的间隔是很大的，而且第二段的末尾能够看出，本段的的对齐方式是 居中的，这种 居中方式还有一种写法，就是把 html中本身就有一对 <center>内部文字</center>居中标记，在对网页文字进行布局时，经常需要将网页中的文字进行 居中对齐，甚至在插入图片或其他对象时，都会用到对齐 居中标记，我们可以把这对标记嵌套在p标记的外部，如，< center><p>中间显示的文字将以段落并且文体 居中的形式体现</p></ center>，其效果与第二段是一致的。

      在html中还有一对<pre></pre>叫预格式化标记，也成为预排版标记，利用这对标记对网页中文字段落进行预格式化，在输入过程中，按键盘上的回车键，就可以生成一个段落，我们来看下面的源代码及页面截图，学习center和pre的用法。

<center>
<pre>
编号      姓名         国籍      口头禅
001     蜡笔小新       日本       老婆！
</pre>
</center>

可以看出<pre>标记允许保留你在源代码中输入的空白和回车，并且这部分文字是居中的。

此外，在网页制作中，我经常会用到水平线，我们在浏览网页的时候，也是经常会看到网页中有一条水平的直线，水平线标记<hr>用来把页 面分成几个部分，比如最简单的，区分开文章的标题和正文，同时我们还可以根据需要对网页中的水平线进行一系列的设置，下面我们就来看一个例子，同时将hr 的属性给同学们做以讲解。

1 <hr align="center" color="red" size=2 width="500px">
2 <hr align="right" size="4"  width="50%">
3 <hr noshade align="left" size="4" width="30%">

 我一共加了三条水平线，其中的一些属性我们都见过，我现在用属性来描述一下这三条线：

1.插入一条居中的高度为2像素、长度为500px的红色水平线。

2.插入一条居右的高度为4像素、长度为占整个页面宽度的50%的水平线。

3.插入一条居左的高度为4像素、长度为占整个页面宽度的30%的无阴影水平线。

我们来看一下效果图：先体会一下默认颜色下有阴影2线和无阴影3线的区别。      

 这里我要重点说的是描述长度属性值的两种方式：绝对值（像素）和相对值（百分比），同样是上个页面，我们把页面窗口的大小调整一下，如下图：

转载于:https://www.cnblogs.com/lishenglyx/archive/2008/12/02/1345479.html