标签、元素、属性、样式的关系与区别

虽然已经开始进入JS的学习,可是回头突然想到html-css里原来一度迷惑我的标签、元素、属性和样式,觉得也是时候总结一下它们的概念和关系了。

1.标签和元素:

比如,<p>这就是一个标签; <p>这里是内容</p >这就是一个元素。也就是说元素由一个开始的标签和结束的标签组成,用来包含某些内容;

注:单标签是个例外。例如<br/>本身既是开始标签也是结束标签,但不包含任何内容,所以这只是个标签。

html网页实际上就是由许许多多各种各样的html元素构成的文本文件,并且任何网页浏览器都可以直接运行html文件。所以可以这样说,html元素就是构成html文件的基本对象,html元素可以说是一个统称而已。标签就是用来标记HTML元素的。

2.属性和样式:

a.属性:

为html元素提供各种附加信息的就是属性,它总以“属性名=属性值”这种名值对的形式出现,而且属性总是在HTML元素的开始标签中进行定义。

例如:

<body>

  <div class="box"></div>

</body>

这里的class就是属性。一个元素里可以有多个属性,各属性之间以空格相分离。如,<div 属性1 属性2 ...></div>

b.样式:

样式是一种新的首选的改变 HTML 元素样式的方式。通过 HTML 样式,能够通过使用 style 属性直接将样式添加到 HTML 元素,也可以加在style标签中放在head里。或者间接地在独立的样式表中(CSS 文件)进行定义,样式有值,一般都会带单位,以“样式:样式值”这样的格式出现。例如:

.box{background-color:#000;width:100px;text-align:center;}

这里的background-color、width等就是样式。样式也可以有多个,各个样式之间用;隔开。如,某选择器{样式1;样式2;...}

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容