html如何正确使用分隔线
时间:2014-03-19 17:31 来源: 翻译器在线 作者:hi
当网站开发人员对网站制作一个专题,或者是制作某些个性网页时,往往会需要使用到分隔线。比如说将内容分隔成左右两栏,甚至是更多栏目的时候,那么就需要使用到html中分隔线了。那在html中分隔线如何才能快速的做出来呢?下面就让我爱IT技术网编辑和大家一起分享如何制作和正确的使用html分隔线。
制作思路分析:这里假设需要分隔页面左右两部分的内容,先利用表格工具拖出一个1行3列的表格,把内容分别放置到左右两个单元格中,然后把中间的单元格的宽度设置为1像素,并填入所需要的颜色,还要把所有表格及单元格的大小单位都设置为像素即可。
思维拓展:制作HTML分隔线,方法很多,除了以上所采用的是表格的方式来制作分隔线。其实还可以使用CSS样式来实现。另外我们也可以制作一个背景图片,在图片上已经画好了分隔线,这样也是可以实现分隔线的作用。
<!--代码清单--> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>html如何正确使用分隔线</title> </head> <body> <table width="250" border="0" cellspacing="0" cellpadding="0"> <tr> <td>左边内容1;<br /> 左边内容2;<br /> 左边内容3;<br /> 左边内容4;<br /> 左边内容5; </td> <td width="1" bgcolor="#FF0000"> </td> <td style="padding-left:30px;" >右边内容1;<br /> 右边内容2;<br /> 右边内容3;<br /> 右边内容4;<br /> 右边内容5; </td> </tr> </table> </body> </html>
效果预览图:
- 评论列表(网友评论仅供网友表达个人看法,并不表明本站同意其观点或证实其描述)
-
