新闻每天都在更新,那网页上的新闻页面是怎么使用Dreamweaver制作的?

新闻每天都在更新,那网页上的新闻页面是怎么使用Dreamweaver制作的?

新闻有很多种,但大多数结构都差不多,我们就先做一个简单的新闻页面,如图1中画圈圈的新闻内容。

新闻每天都在更新,那网页上的新闻页面是怎么使用Dreamweaver制作的?_第1张图片

图1

  • 案例实现
  1. 新闻页面一般由四个部分构成,分别为标题、发布日期、水平线和网页正文。其中标题使用

    标签定义,发布日期和网页正文用

    标签定义,水平线用


    标签定义。

  2. 样式分析

  (1)标题:因为图中标题是文字靠左,因此

标签不需要添加align属性,因为不添加的话,默认文本是靠左的。但

标签中要嵌套标签,添加字体即face=”微软雅黑”,用于设置标题文本的特殊字体。

  (2)发布日期:因为图中字体向左靠拢,因此也不需要添加align属性,只需要添加文本的字体,即face=”微软雅黑”。观察可以发现日期的颜色不一样,因此还需要在添加一个标签来控制文本颜色。

  (3)水平线:图中水平线比较浅,但还是有。我们可以使用


标签中的size、color属性来控制水平线的粗细和颜色。

  (4)网页正文:图上并没有做过多的修饰,只是把文字叙述出来,因此我们只需要一个

标签就可以了。

    3.开始搭建网页结构

     我们已经分析了新闻页面的样式,但是需要注意一点,我们可以发现网页中文本之间会有距离,网页中表示空格的代码之一是 。因此我们只要在想要文本输入 ,保存刷新就会出现空格了。现在我们开始写代码,写完代码后如图2.

新闻每天都在更新,那网页上的新闻页面是怎么使用Dreamweaver制作的?_第2张图片

图2

         保存并浏览,如图3.

新闻每天都在更新,那网页上的新闻页面是怎么使用Dreamweaver制作的?_第3张图片

图3

二.以上就是网页上新闻页面用Dreamweaver制作的内容了。

你可能感兴趣的:(#html,dreamweaver,html)