前军教程网

中小站长与DIV+CSS网页布局开发技术人员的首选CSS学习平台

「HTML」从零开始学网页制作-02(html网页设计制作教程)

接下来的任务是完成下面页面制作:

第一步

上一次一样,建立一个空白文档,并输入基础代码,这里不再赘述。

修改标题为“旅游新闻”

在上方效果图可以看到“俄媒盘点三大性价较高的度假胜地”这一段话又大又粗,要达到这样效果需要学习一个新标签:

<h1></h1>

在<body></body>里面写入:

<h1>俄媒盘点三大性价较高的度假胜地</h1>

保存打开浏览器一看:

wow!这字可比前面学的<p>标签大多了,这是因为<h1>标签可以定义标题!

常言道:看书先看皮,看报先看题,标题可以使读者了解到文章的主要内容和主旨。

不过……标题好像太大了?没关系,因为除了<h1>还有<h2><h3><h4><h5><h6>,这六个从大到小,任你选择。

总结:

<h1> - <h6> 标签可定义标题。因此标题请用<h1>-<h6>标签。<h1> 定义最大的标题。<h6> 定义最小的标题。

第二步

在大标题下面还有一行小字,别漏掉了

当我们输入:

<p>2020-08-20 00:02:38 来源:环球时报</p>

发现字号比效果图大,而且颜色也不对。那么试试看在<p>标签里面加入<font>标签,并设置属性:

<p><font size="2" color="#545454">2020-08-20 00:02:38 来源:环球时报</font></p>

是不是感觉变得一模一样了!

这是因为<font>标签规定文本的字体、字体尺寸、字体颜色。

size:设置字体尺寸,取值有1~7。

color:设置字体颜色,该属性可以有3个值:

仔细看上面图片,在第二个<p>标签后面有这么一句话:“<!--当两位代码相同时,可以简写为#f00-->”,但是这句话没有出现在浏览器中。

这个 <!----> 叫做注释标签用于在源代码中插入注释。注释不会显示在浏览器中

您可使用注释对您的代码进行解释,这样做有助于您在以后的时间对代码的编辑。当您编写了大量代码时尤其有用。例如:<!--这是注释,不会出现在浏览器-->

总结:

<font>标签用于改变字。请善于使用注释,<!---->

未完待续

发表评论:

控制面板
您好,欢迎到访网站!
  查看权限
网站分类
最新留言