当前位置: 首页 > 图文教程 > 网页制作 > HTML/XHTML教程 > HTML教程:html水平线段<HR />

HTML/XHTML教程
IE 下的只读 innerHTML
IE8下noscript标记的BUG仍然存在
HTML 5 canvas 基本语法
HTML5教程(1):HTML5的Canvas概述
Canvas教程(2):基本用法
Canvas教程(3):Drawing shapes绘制图形
Canvas教程(4):Using images应用图像
W3C推荐的 DTDs(文件类型声明)
10个最经常犯得HTML标签错误
HTML5中会被丢弃的元素和尚待解决的问题
IE6下网页制作参考:IE6的默认样式
html5来了,你准备好了吗
20个使用水彩效果的网站设计
Xhtml下不常用却很有用的标签
input标签里面的name与value的区别
img图片标签赋予alt属性是否需要
HTML small标记使用技巧
WEB标准 网页页面结构
Marquee标记在XHTML代码中该如何用
自己碰上的IE8兼容笔记

HTML/XHTML教程 中的 HTML教程:html水平线段<HR />


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-28   浏览: 61 ::
收藏到网摘: n/a

这个标签可以在屏幕上显示一条水平线,用以分割页面中的不同部分。

<HR>有三个属性:

   size 水平线的宽度
   width 水平线的长,用占屏幕宽度的百分比或象素值来表示
   align 水平线的对齐方式,有LEFT RIGHT CENTER三种
   noshade 线段无阴影属性,为实心线段

  我们可以用几个例子来说明这线段的用法:

 


 

线段粗细的设定

<HTML>
<HEAD>
<TITLE>线段粗细的设定</TITLE>
</HEAD>

<BODY>
<P>这是第一条线段,无size设定,取内定值SIZE=1来显示<BR>
<HR />
<P>这是第二条线段,SIZE=5<BR>
<HR SIZE=5>
<P>这是第三条线段,SIZE=10<BR>
<HR SIZE=10>
</BODY>

</HTML>


 

 

线段长度的设定
<HTML>
<HEAD>
<TITLE>线段长度的设定</TITLE>
</HEAD>

<BODY>
<P>这是第一条线段,无WIDTH设定,取WIDTH内定值100%来显示<BR>
<HR SIZE=3>
<P>这是第二条线段,WIDTH=50(点数方式)<BR>
<HR WIDTH=50 SIZE=5>
<P>这是第三条线段,WIDTH=50%(百分比方式)<BR>
<HR WIDTH=50% SIZE=7>
</BODY>

</HTML>

 


 

线段排列的设定

<HTML>
<HEAD>
<TITLE>线段排列的设定</TITLE>
</HEAD>

<BODY>
<P>这是第一条线段,无ALIGN设定,(取内定值CENTER显示)<BR>
<HR WIDTH=50% SIZE=5>
<P>这是第二条线段,向左对齐BR>
<HR WIDTH=60% SIZE=7 ALIGN=LEFT>
<P>这是第三条线段,向右对齐<BR>
<HR WIDTH=70% SIZE=2 ALIGN=RIGHT>
</BODY>

</HTML>


 

 

无阴影的设定

<HTML>
<HEAD>
<TITLE>无阴影的设定</TITLE>
</HEAD>

<BODY>
<P>这是第一条线段,无NOSHADE设定,取内定值阴影效果来显示<BR>
<HR WIDTH=80% SIZE=5>
<P>这是第二条线段,有NOSHADE设定<BR>
<HR WIDTH=80% SIZE=7 ALIGN=LEFT NOSHADE>
</BODY>

</HTML>

最后一个水平线: