教你轻松学会HTML语言系列之二网页

普及信息化基础,让每一个人都懂一点儿编程知识。

前面我们讲解了网页的基本基础,以及使用记事本制作网页的操作步骤。

第一篇参考:教你轻松学会HTML语言系列之——揭开网页制作的神秘面纱

从本文开始,我们就为大家介绍一些常用的HTML基本标签及其属性。

01网页背景常用属性

所谓属性,就是这个标签特有的一些特性。比如:我们写作文描述一个人,经常会讲到关于这个人物的一些基本特征,戴着四四方方的眼睛、高高的鼻梁等等。在网页标签里面,每一个标签都有自己独特的一些属性。语法规则是:

标签属性名=“内容”属性名2=“内容”…/标签

这样的属性可以有多个,在body(身体)标签里面,常用的属性有如下几个:

1、背景颜色bgcolor

2、背景图片background

3、页面字体颜色text

一般背景颜色和背景图片两个属性只能二选一,当同时出现时,优先呈现背景图片效果。(当然,也可以同时出现,需要后面学习CSS/层叠样式表是可以做到同时呈现的,不要着急。)

比如:

bodybgcolor=”red”text=”white”设置网页背景颜色为红色,字体颜色为白色/body

在设置背景颜色时,可以使用常规的英文单词,如:red、green、black、yellow等;还可以使用特定的编码格式,即:RGB三原色模式。R代表红色,G代表绿色,B代表蓝色,用十六进制表示,每种颜色代表两位。前两位是红色,中间两位是绿色,最后两位是蓝色,随机组合可以搭配出各种各样的颜色。

#ffffff白色#黑色#ff红色#00ff00绿色#ffff00黄色(红色+绿色组合)

属性background,可以设置网页的背景图片,给一个图片的路径即可。有关路径的内容后面会详细讲解。这里,我们只需要把图片和网页文件放在一个目录文件下面即可。如下面图示的5.png图片和aa.html网页文件是在同一个文件夹(目录)里。

试试看,你制作成功了没有?如果还有不清楚的,欢迎在评论区咨询了解或私聊。

02字体标签及常用属性

接下来,我们讲字体标签font,其有三个常用属性,分别是:size(字体大小)、color(字体颜色)、face(字体类型)。具体语法:

fontsize=”7”color=”yellow”face=”隶书”你好,你好呀/font

其中,字体大小分为七个等级,分别从数字1到数字7,依次增大。1号字体最小,7号字体最大,默认(不写的情况下)为3号字体。

这里,细心的朋友会注意到,在源代码里“设置网页包含背景图片”的文字和“你好,你好呀”换行了得,而在页面呈现出来的效果中却没有换行,是不是感觉很奇怪?这是因为源代码的的内容并不会一模一样的在网页中呈现出来,这里有两种解决办法:

03换行及预格式化标签

一种使用换行标签br,该标签是单标签,只有开始,没有结束,这就是网页中的换行符号,类似于C语言中的(\n)一样的效果。

另一种是使用pre预格式化标签,这是双标签。就是源代码里是什么格式,网页呈现出来的效果就是什么格式。

04标题标签及属性

最后,讲一个标题标签,书籍的每一章每一节都是有标题的,如何在网页中实现这样的标题内容呢?HTML里面给出了h1到h6的六个级别的标题标签(双标签),依次是由大到小的顺序,h1标题最大,h6标题最小。其包含一个align(对齐方式)的属性,取值为:left(默认/向左)、center(居中)、right(向右)对齐等。

上图中,我们可以看到二级标题居中显示了,是因为加了align=”center”的属性;同理,四级标题靠右显示。细心的朋友可能发现了,一级标题的颜色是红色,与其他标题的颜色不同。因为标题标签里没有颜色(color)的属性,所以,我们在其内部嵌套了一个字体(font)标签,借用字体里面的颜色属性,重新改变了一级标题的颜色。通过这个例子以及前面预格式化标签的案例,我们可以得出一个结论:标签是可以相互嵌套的。

05总结

本文主要讲解了

1、身体body标签的常用属性:bgcolor、background、text;

2、字体font标签的常用属性:size、color、face;

3、标题h1-h6标签的常用属性:align;

4、预格式化标签pre;

5、换行标签br,属于单标签。

这些内容你都掌握了吗?




转载请注明:http://www.aierlanlan.com/cyrz/2708.html

  • 上一篇文章:
  •   
  • 下一篇文章: 没有了