第3课:HTML的元素与标签

本节课我们学习HTML的重要成分——元素(element)。
元素用于结构化HTML文档,并告知浏览器如何呈现网页。一般来说,元素由首标签(start tag)、内容(content)和尾标签(end tag)构成。

“标签”是什么?

标签(tag)指示元素的起始与结束,所有标签都由“<”及“>”所围住,如<html>。
一般标签成对出现,首标签(start tag)(如<html>)和尾标签(end tag)(如</html>)。它们唯一的区别在于,尾标签多一条斜杠“/。你通过把内容放在首标签和尾标签之间来对内容进行标记。
HTML主要就是各种各样的元素,所以,学习HTML,就是学习使用各种元素。
可以举些例子么? 没问题。比如,b元素的作用是告诉浏览器介于标签<b>和</b>之间的文本应以粗体显示。(这里的“b”是“粗体(bold)”的意思。)
例1:

<b>这句话应显示为粗体。</b>

该例在浏览器中将显示如下: 这句话应显示为粗体。 h1、h2、h3、h4、h5及h6元素的作用是显示标题(这里的h是“标题(heading)”的意思)。其中h1是一级标题,字体最大;h2是二级标题,字体比一级标题略小;而h6是六级标题,它是最后一级标题,字体也最小。
例2:

<h1>这是标题</h1>
<h2>这是子标题</h2>

该例在浏览器中将显示如下:

这是标题

这是子标题

首标签和尾标签总是必须的吗? 常言道,凡事均有例外。在HTML中,也有些元素没有尾标签,比如像下面这个换行标签:

<br />

html标签中的字母应该大写还是小写?

浏览器不介意标签是大写还是小写,或者混合大小写。无论大写还是小写在浏览器上的显示效果都一样。
但是,正确的写法是采用小写字母来书写标签。所以,要养成用小写字母书写标签的习惯。
这一课就到这里,如果花10分钟时间继续学习下一课的话,你将能够制作自己的第一个网站。

125jz网原创文章。发布者:江山如画,转载请注明出处:http://www.125jz.com/500.html

(18)
江山如画的头像江山如画管理团队
第4课:制作自己的第一个网站
上一篇 2018年1月20日 下午3:37
第2课:HTML是什么?
下一篇 2018年1月20日 下午3:51

99%的人还看了以下文章

  • CSS3:Box-shadow 教程及实例-制作逼真的图片阴影效果

    CSS3:Box-shadow 教程及实例-制作逼真的图片阴影效果CSS3:Box-shadow 教程及实例-制作逼真的图片阴影效果CSS3:Box-shadow 教程及实例-制作逼真的图片阴影效果CSS3:Box-shadow 教程及实例-制作逼真的图片阴影效果

    box-shadow属性的基本用法 使用Box-shadow制作逼真的图片阴影效果 使用伪元素::before和::after,我们能实现非常逼真的只有图片才能实现的阴影效果。 HTML: <div class=”box11 shadow”></div> CSS: .box11 { width: 300px; height: 100p…

    2019年1月5日 网页制作
    10.6K0
  • 第11课:边框(border)

    边框(border)可以有多种用途,比如作为装饰元素或者作为划分两物的分界线。在设置边框方面,CSS为你提供了无尽选择。border-widthborder-colorborder-style 边框宽度[border-width] 边框宽度由CSS属性border-width定义,其值可以是“thin”(薄)、“medium”(普通)或“thick”(厚)等…

    2020年2月25日
    6.5K0
  • Dedecms的tplcache文件夹是什么,可以删除吗?

    tplcache是DeDeCMS里data目录下的模板缓存数据,时间久了就会积累成千上万的文件,而且会越来越大。dede模板缓存可以加快网页文件的生成速度,关闭的话,理论上说除了生成速度变慢之外没什么影响。tplcache文件夹是可以删除的。

    2023年3月19日
    4.6K0
  • 纯CSS制作红色网站二级下拉导航菜单

    纯CSS制作红色网站二级下拉导航菜单,代码非常简洁,适合修改后使用,入门就能掌握。 二级下拉导航菜单HTML代码: <nav> <ul> <li><a href=”#”>首页</a></li> <li><a href=”#”>电影</a> <ul…

    2019年4月17日
    16.6K0
  • 第10课:外边距和内边距

    上一课,你学习了盒状模型。在这一课,我们将了解如何通过设置margin(外边距)和padding(内边距)这两个CSS属性来改变元素的显示。 为元素设置外边距 为元素设置内边距 为元素设置外边距 一个元素有上(top)、下(bottom)、左(left)、右(right)四个边。外边距(margin)表示从一个元素的边到相邻元素(或者文档边界)之间的距离。可…

    2020年2月25日
    9.0K0
  • label文字与textarea、input垂直居中、顶部对齐的方法

    在网站表单制作时label标签里的文字与Iput、textarea标签的默认对齐方式不美观,如下图。 姓名: 留言: 中国网页设计给大家分享label文字与input、textarea垂直居中对齐和顶部对齐的简单方法。 label文字与textarea、input垂直居中的方法 在input标签样式中加入css标签vertical-align: middle…

    2018年3月18日
    11.8K0

发表回复

登录后才能评论