发新话题
打印

【设计】HTML帖子制作教程

让我们首先从字体设置开始。
在HTML代码里,字体的定义并不是很难,我们只需用<font>标签即可定义字体、字号、字体颜色等。<font> 标签原则上要求成对出现,即在被修饰的字体前使用<font>引导,在被修饰的文字后用</font>结尾。下面给出例子和效果及相关说明:
语法:<font face=黑体 size=4 color=red>黑马在线动力</font>
效果:黑马在线动力
    说明:<font>标签里,face为字体名称,“=黑体”即表示被修饰的文字即“黑马在线动力”的字体为黑体,至于定义为什么字体,看你的喜好了,如果你所设置的字体不存在,系统自动使用默认字体显示(如中文Windows平台下宋体就是默认字体);size表示字号,论坛里可用字号是1号到7号,通常数字越大字号也就越大(也有的论坛相反),如果用户定义的字号超过7号则以7号显示(但还有其他方法突破7号字体,稍后我们会讨论到的);color用来定义文字的显示颜色,其值放在和前面的各元素一样放在等号的后面,颜色的表示方式可用少量的颜色英文明文,也可用Web色码方式,如#ff0000,色码表请参阅黑马在线动力提供的色码表。
size还有一种赋值方法,形式如下:
<font size=+1>黑马在线动力</font>
这类表达式适用于未使用CSS设定的页面,它表示被修饰的文字在默认字号基础上加大一号。
字体修饰还用到其他的标签,分别介绍如下:
粗体:<b>文字</b>  (例:文字)
加重:<strong>文字</strong> (例:文字)
上标:<sup>文字</sup>  (例:文字)
下标:<sub>文字</sub>  (例:文字)
斜体:<i>文字</i>  (例:文字)
下划线:<u>文字</u>  (例:文字)
提示:连同<font>标签一块,以上这些修饰方法,只要不相互冲突就可以结合起来使用。
标题修饰:<hx>文字</hx>。其中,x为1到6的数字。以下是h1到h6的标题式样效果,我们可以看到,字号是逐渐变小的:
标题一
标题二标题三
标题四
标题五
标题六
最后讲讲突破7号字大小问题:
我们需要以嵌套方式调用CSS样式来定义字体,这种方法可以让我们最大限度地设置字号大小,实现方法也很简单,只需在<font>标签里用以下代码替换纯HTML原来的元素即可。请看以下代码和效果:
代码:<font color=#ff0000 style="font-size: 100pt;font-family:华文行楷,隶书,黑体">春天</font>
效果:
春天
CSS扩展了HTML功能,它能够令帖子和网页的可控制程度更高。更多的CSS知识我们将在后面陆续介绍,你也可以阅读 这个了解和学习一下CSS滤镜修饰字体的强大功能。
表格初步
    表格是在论坛做帖的重要武器。这原因是,论坛里提供给用户操作的区域是非常有限的,用户只能在论坛程序框架好的body区域里的某个区域施展身手,不能修改body的背景色,更不能介入head的定义,因此,诸如让自己的帖子有底色、底图之类的修饰,用户只能通过表格来实现。表格是一个可自定义的容器,因而它就是我们用以实现帖子构设的利器。
    把表格称作容器缘于表格的装载特性。表格是用于装载数据的,与我们现实中所看到和理解的表格非常一致。我们在Word和Excel里都接触过表格,知道表格有表头、表体、单元格、行、列等等概念,它们并不难理解。而在HTML里,我们对表格的理解和运用可能会增加一些概念,但并非复杂,在学习本教程的过程中,通过领会和实践,相信是很容易掌握的。
    表格不仅仅只能装载数据,它还被广泛地应用于网页的布局,这与表格可以将其所在区域划分为行和列即诸多单元格密切相关。表格用于网页布局过去非常流行,现在仍然深受欢迎,它在论坛做帖也起到不可估量的作用,帖子的页面布局将因使用了表格而可以随心所欲地排版。
    现在我们来看看表格的基本代码构成。以下是一个完整的表格标签代码框架,为了能够一目了然,各元素尚未引入它们的属性:
<table>
  <tbody>
    <tr>
       <td>内容</td>
    </tr>
  </tbody>
</table>
    说明:
    <table>:表格的起始符。任意一个表格的开始都必须以它开头,且必须有终止符</table>。
    <tbody>:表体的起始符。紧跟在<table>之后,表示表体开始。必须有结尾符,放在</table>之前。在纯网页中可以不要tbody元素,但在论坛一定要使用,否则,当帖子用到较多的表格时,论坛的自动填充功能将可能会导致代码出错。
    <tr>:tr的作用是规定表格的行,其中,t是table,r是row(行)。有多少组tr,这张表格就有多少行。<tr>紧跟在<tbody>之后。必须有终止符</tr>。
    <td>:td的作用是规定表格的列,t是table,d可理解为down(向下)。有多少组td,这张表格就有多少列。第一个<td>紧跟在<tr>之后。终止符为</td>。td与tr配合构成单元格。
    </td>、</tr>、</tbody>、</table>:这些都是相应元素的终止符,表示相应元素所规范的内容结束。必须注意它们的排列顺序,不能有错。
    从表格的代码框架分析得出:表格标签里,所有元素都成对出现,而这些元素是按照从大到小的顺序从外往里层层包裹的。table最大,它占在起始和终结的位置,tbody是老二,tr是老三,td最小,它在最里层。
    本节对表格的介绍到这里打住,更多的表格内容将陆续介绍。下课。
发新话题
最近访问的版块