当前位置: 首页 > Web前端 > HTML5

零基础教你学前端——4.标题和段落标签

时间:2023-04-05 13:12:33 HTML5

本课学习页面中的标题和段落标签。为了丰富页面的内容,需要使用各种不同的标签。共有三种不同类型的标题。它们的大小和大胆是不同的。这些段落此时需要使用不同的标签。表示页面上有6个title标签,h1到h6分别对应不同的字号和粗体。打开编辑器,新建一个文件title.html,在body中写一个h1标签。来到浏览器,我们可以看到出现了一个一级标题。回到编辑器,我们依次记下h2到h6标签,刷新浏览器,出现六个不同的标题。这是页面中的标题标签。这些标题标签h1最大h6最小,加粗效果也是h1最粗h6最细。只有六个标题标签h1到h6可供我们使用。段落标签p标签是一个双标签。只要是文章的正文内容区,都可以使用p标签打开编辑器。让我们创建一个新文件section.htm来生成初始结构。这里我们用一个p标签

把我事先准备好的文本复制过来,返回给浏览器。p标签中的文字默认从左边开始,然后依次向右排列。当屏幕右侧的文本折叠时,实际上使用了P标签。实现自然段的切分。回到浏览器,页面上自然而然地出现了一段一段。但是每个自然段落的首行必须缩进2个字符,如何实现这个效果呢?在编辑器中直接使用空格键打开浏览器,发现无论编辑器中有多少个空格,都只能显示一个空格。为了实现这个效果,我们目前使用的方法是一个代表一个空格键的距离。如果想实现多个空间距离,就多写几个。我们把刚才写的空格改成来浏览器刷新页面,效果就实现了。最后,我们把写好的空格复制下来,每段加一个。来到浏览器,一个文本的网页就完成了。.接下来,让我们来实现示例内容。首先新建文件news.html,观察效果。第一行是一级标题。我们需要使用H1标题标签来打开浏览器。文本未居中。我们可以为h1标签添加一个align属性。是文本水平方向的对齐属性值。再次刷新浏览器后,我们可以看到实现了文字居中的效果。字幕使用了h4标签,这里也自带了一个h4标签,并且添加了一个align属性来居中显示。下面是一个小段子。p标签写这段文字,加上2个空字符,来到浏览器。接下来是每篇小文章的标题,这里使用h3标签实现。文章副标题结束后,接下来就是热点新闻的第一段。我们使用p标签,将相应的文字放入标签中,相应的间距留空,在浏览器中运行,可以看到已经达到了相应的效果。第一篇文章写完了,下面的格式跟这篇一样!