天涯部落

小圈子,大声音!呼朋引伴网聚部落!

创建新部落?

 HTML边框代码元素的分析

楼主:人间惆怅客SD 时间:2013-01-21 00:02:08 点击:749 回复:21
脱水模式给他打赏只看楼主 阅读设置
  请管理不要点“编辑” “不能编辑”按钮,否则,帖子就乱了,谢谢。
  
  
  HTML边框代码元素的分析
    
    HTML是由WEB的发明者Tim Berners-Lee和同事Daniel W.Connolly于1990年创立的一种标记式语言。它是标准通用化标记语言SGML的应用。用它的语法规则建立的文档可以运行在不同操作系统的平台上。因此,HTML文档属于纯文本文件(它能用任意的文本编写器书写)。
    
    HTML代码应用非常广泛,我们在来吧编辑帖子只使用到其中的一部分,现在来讲解一下这些语言的定义,方便大家学习使用HTML代码语言。
    
    我们做边框实际就是在做表格,HTML代码表格的主要元素首先要了解。
    
    1**标签
    
    table,tr,td 称为HTML的标签,以双标签的形式出现,所谓双标签,也就是有一个<table>就有一个对应的</table>与之对应,同样适用于其他的双标签。
    如:
      <TABLE><TBODY><TR><TD><TABLE><TBODY><TR><TD>内容</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>
      有多少<TABLE><TBODY><TR><TD>打头就得有多少</TD></TR></TBODY></TABLE>收尾,否则就会出错,其他标签适用。
    
    2**<table>标记的主要属性
      
    
    align定义表格的对齐方式,有三个属性值center,left,right
      background定义表格的背景图案,属性值为图片的地址
      bgcolor定义表格的背景颜色,属性值是各种颜色代码
      border定义表格的边框宽度,属性值是数字
      bordercolor定义表格边框的颜色,属性值是各种颜色代码
      cellpadding定义单元格内容与单元格边框之间的距离,属性值是数字
      cellspacing定义表格中单元格之间的距离
      height定义表格的高度,属性值是数字
      width定义表格的宽度,属性值是数字
    bordercolorlight 表格边框向光部分的颜色
      bordercolordark 表格边框背光部分的颜色,
      使用 bordercolorlight 或 bordercolordark 时 bordercolor 将会失效,即不能同时使用。
    
    <tr>标记,表格是由多行与多列组成的,<tr>标记用来定义表格的一行,他的属性极其属性值定义的是表格中的该行,其主要属性与属性值如下:
      *align定义对齐方式,属性值与上同
      *background定义背景图案 bgcolor定义背景色
      
      <td>标记。用<td>标记概况起来的内容表示表格的单元。其主要属性与属性值和<table>标记的一样,补充两个合并列和行的代码:
      colspan定义合并表格的列数,属性值是数字
      rowspan定义合并表格的行数,属性值是数字
    
    3**文字标记
    
    基本代码如下:
      <P align=center><FONT color=#0066ff face=隶书 size=5>插入文字</FONT></P>
      align=center 表示字体居中,可选值为居右(right)居左(left)
      *color=颜色代码
      *face=字体 常用字体为:宋体.黑体.楷体.新宋体.隶书等
      *size=字体大小,这里的最大值为7 取值越大文字就越大
      
      1.字体变化 <font>..........</font>
      
    
    a.字体大小 <font size=#>..........</font> #=1~7;数字愈大字也愈大
      b.指定字型 <font face="字体名称">..........</font>
      c.文字颜色 <font color=#rrggbb>..........</font>
    
    
    2.粗体字 <b>..........</b>
      
      3 字体加粗<STRONG>..........</STRONG>和<b>标签差不多的效果
      
      4.换行(也称回车)
      
      5.分段标记 <p>
      文字的对齐方向 <p align="#"> #号可为 left:表向左对齐(预设值) center:表向中对齐 right:表向右对齐 <p align="#">之后的文字都会以所设的对齐方式显示,直到出现另一个<p align="#">改变其对齐方向,遇到<hr>或<h#>标签时会自动设回预设的向左对齐。
    
    
    4**区隔标记 <DIV>
    
    <DIV>称为区隔标记。作用:设定字、画、表格等的摆放位置。
      <DIV>应用于 Style Sheet(式样表)方面会更显威力,它最终目的是给设计者另一种组织 能力,有 Class ; Style ; title ; ID 等属性。
      
      以 <DIV align="center"> 为例:
      align="center" 可选值:center ; left ; right 。决定字、画、表格等居中、靠左或靠右。
      <DIV align="center"> 的作用和居中标记 <CENTER>一样。
    
    
    5*图片标记
      
      1.插入图片 --<img src="图形文件名">
      
      2.设定图框 -- border <img src="图形文件名" border=点数>
      
      3.设定图形大小 -- width、height <img src="图形文件名" width=宽度点数 height=高度点数>
      
      4.设定图形上下左右留空 -- vspace、hspace <img src="图片地址" vspace=上下留空点数 hspace=左右留空点数>
      
      5.图形附注 <img src="图片地址" alt="说明文字">
      
      例如  <img src="图片地址" width=180 height=152 border=0>
    
    6**歌曲代码:
      
    
    在这组代码中,不必管它是mms.http.rtsp,只要看尾缀是asf、wma、wmv、wmv、rm都可适用下面的代码:
      1.手动播放:
      <EMBED src=歌曲地址 volume="100" width=39 height=18 hidden="FALSE" autostart="fault" type="audio/x-pn-realaudio-plugin" c>
      2. 打开页面自动播放:
      <EMBED src="歌曲地址" width="39" height="18" autostart="true" hidden="false" loop="infinite" align="middle" volume="100" type="audio/x-pn-realaudio-plugin" c autostart="true">
    
    
    最后介绍一下帖子背景的代码,这个代码目前天涯可以使用,代码如下;
    <STYLE>body{background:center url(http://laiba.tianya.cn/laiba/images/15714891/12487469510520721460/A/1/l.jpg);background-attachment:fixed}</STYLE><STYLE>.content{BACKGROUND-COLOR: transparent ;COLOR: #a02040 ; FONT-FAMILY: 黑体; LINE-HEIGHT:24px; FONT-SIZE: 20px}</STYLE></EMBED></EMBED></CENTER></DIV></DIV></DIV></DIV></DIV></h></b></table></table
    
    
  
楼主人间惆怅客SD 时间:2013-01-21 00:03:54
   借用微斯雨制作的帖子背景代码图解做一下说明:






楼主人间惆怅客SD 时间:2013-01-21 00:11:45
  声明:
  
  本帖资料全部来自网络共享资源。限于本人水平,如有错误,遗漏,请各位师长及时指出,以免误导广大天涯爱好编辑的朋友,谢谢!!
楼主人间惆怅客SD 时间:2013-01-21 00:15:19
  @紫玉仙子
  
  问好紫玉!!您的问题本帖可能有所帮助,敬请阅过。
作者 :我的心在飞扬2011 时间:2013-01-21 08:34:04
  惆怅现在这样系统地介绍非常有必要,可让刚入平台来吧的网友有很大的帮助。辛苦了!@人间惆怅客SD
作者 :紫玉仙子 时间:2013-01-21 08:52:47
  @人间惆怅客SD 我来啦,谢谢您的热心帮助。。。
作者 :紫玉仙子 时间:2013-01-21 08:53:24
  等下忙工作了,中午我慢慢来学些。。。
楼主人间惆怅客SD 时间:2013-01-21 20:32:20
  @我的心在飞扬2011
  
  我把网络上的资料整理了一下,贴在这里。这都是人家的东西,我们感谢网络吧。
楼主人间惆怅客SD 时间:2013-01-21 20:34:56
  @紫玉仙子
  
  紫玉客气啦。我贴出来的不一定全面,咱们共同学习吧。
  
  晚上好!!
作者 :枫叶Fs 时间:2013-01-21 20:41:42
  很详细!惆怅有心了,辛苦!
作者 :紫玉仙子 时间:2013-01-21 20:51:41
  嘻嘻,我来报到。
楼主人间惆怅客SD 时间:2013-01-21 21:07:22
  @枫叶FS
  
  谢谢枫叶君的普洱茶与鲜花!!!惆怅好感动。
作者 :我的心在飞扬2011 时间:2013-01-21 21:15:00
  还是要感谢惆怅君的,是你的付出才有了我们的分享!再次说声:谢谢你!@人间惆怅客SD
楼主人间惆怅客SD 时间:2013-01-21 21:24:36
  @我的心在飞扬2011
  
  飞扬太客气了,能与大家一起分享,是平台的使命。惆怅比起大家,做得还很少。
作者 :薰依依小草 时间:2013-01-22 11:08:30
  谢谢分享
楼主人间惆怅客SD 时间:2013-01-22 21:32:40
  @薰依依小草
  
  感谢小草朋友临帖留言。问晚安!!!
作者 :紫玉仙子 时间:2013-01-23 19:59:16
  又来报到。每天有时也要编辑点大树帖子的。每次我都慢,因为不大熟练,所以姗姗来迟了。。。
楼主人间惆怅客SD 时间:2013-01-23 22:58:21
  @紫玉仙子
  
  紫玉晚上好!!!
作者 :紫玉仙子 时间:2013-01-25 21:21:53
  我又来报到了。来学习。。。
作者 :美到心间 时间:2013-01-29 08:16:57
  楼主,试了一下音乐代码都不能播放,不知为啥
作者 :紫玉仙子 时间:2013-01-31 22:59:56
  再来学习。。。
作者 :枫叶Fs 时间:2013-02-03 20:59:41
  @美到心间  问好美美!音乐地址有没有错呢?建议看一下【[歌曲制作] 虾米音乐和多米音乐制作】http://groups.tianya.cn/tribe/showArticle.jsp?groupId=438330&articleId=02c279f926616550a7afc7ae04d2cdf7&fm=0

相关推荐

    发表回复

    请遵守天涯社区公约言论规则,不得违反国家法律法规