掌握网页代码基本格式(HTML页面的基本代码结构是什么?)

很多刚入门HTML5前端开发的小伙伴对HTML页面的基本机构代码还不是很清楚,下面和千锋广州小编一起来看看吧。 [原文来自:www.ii77.com]

1、什么是标签:

[转载出处:www.ii77.com]

html标签组成是html文档的最基本元素,一般是成对出现,由开始标签和与其对应的结束标签构成.?如<html></html>,<p></p>,<body></body>,<head></head>,<span></span>等,此外,还有一些标签是单独出现的,如<img/>,<input/>等,标签可以相互嵌套使用。

由于html语言是一门弱类型语言,对格式的要求不是非常严格,因此所有标签是不区分大小写的,但是,一般在实际开发中,大家都统一使用小写。

2、html文档的基本结构

如上图,每一个html文档的基本结构为:

HTML5前端开发入门:HTML页面的基本代码结构是什么?


第一层:

<!DOCTTYPE>------!文档类型,它的目的是要告诉标准通用标记语言解析器,它应该使用什么样的文档类型定义(DTD)来解析文档,在html5文档中,一般写为<!DOCTTYPE html> ;值得注意的是,<!DOCTTYPE>不属于html标签。

<html></html>-------html标签,是html文档的根标签,所有的网页标签都放在这对标签中,是所有html标签的祖先容器。

第二层:

<head></head>-------头部标签,代表着html文档的头信息,是所有头部元素的容器,内部一般包含:<title> <script><style><meta><link>这些头部元素。

<body></body>-------网页主体标签,其内部主要包含着构成网页内容的一些元素,如<p></p>,<span></span>,<div></div>,<table></table>等。这些元素都会在网页的内容部分显示。

3、标签的属性

就如人有这身高、体重、年龄等这些属性一样,html标签也有自己的属性,如字体颜色,宽,高,背景等。这些属性一般通过键值对的形式卸载标签中,是标签的一部分,并且每种标签的属性都不完全像同,有的标签有着自己特有的属性。如下图所示:

HTML5前端开发入门:HTML页面的基本代码结构是什么?


4、html注释

在实际开发中,我们需要在html文档中做一些标记,方便日后对代码的维护及修改,也方便其他程序员了解我们的代码。而在html文档中,注释的格式为:

HTML5前端开发入门:HTML页面的基本代码结构是什么?


我们可以理解为,html中,标签元素是给计算机读的,为注释是给程序员看的。


自媒体 微信号:ii77 扫描二维码关注公众号
爱八卦,爱爆料。

小编推荐

  1. 1 突发!伊朗对以色列发动大规模导弹和无人机袭击

    这是4月13日在以色列特拉维夫拍摄的以色各国防部建筑。新华社本地时间14日,伊朗伊斯兰革命卫队针对其军事动作发布第二份声明。声明透露,因为

  2. 2 伊朗:袭击可被视为已“结束”

    点击上方“CCTV4” 存眷我们!伊朗常驻结合国代表团称伊朗对以色列的袭击可被视为已“竣事”。本地时间4月14日,伊朗常驻结合国代表团在社交媒

  3. 3 刚刚!连发5道预警!江西人注意,别乱溜达!

    今天暴风暴雨又囊括而来一大早 江西省景象台就接连发布四道预警大风黄色预警旌旗宜春、新余两市的部门区域将显现8-10级雷暴大风局地伴有强雷电

  4. 4 知名女演员因这事被气进医院……网友:深有感触

    比来知名童星关凌在社交平台发布了一个视频激发好多网友热议关凌透露,只因为前一天晚上给两娃指点了作文和阅读懂得,究竟晚上睡觉之前就感

  5. 5 万亿零食市场“开卷”,B站up主实探东莞供应链

    ▲点击存眷麻涌镇当局“艳丽麻涌”官方微信可乐2.3元一瓶、矿泉水1.2元一瓶、爽性面0.9元一包……近年来,量贩零食店的显现,为“吃货”们打

  6. 6 便民服务 | 黄龙溪镇:便民有温度,服务“零距离”!

    点击蓝字存眷我们群众事 无小事黄龙溪镇以更贴心更高效的办事体式起劲做大好人民群众“贴心人”切实提拔群众的获得感、幸福感↓↓↓1深化办事

  7. 7 伊朗袭击以色列!最新消息汇总→

    本地时间4月14日,伊朗伊斯兰革命卫队揭橥声明,为了回应以色列的罪过,个中包罗袭击伊朗驻叙利亚使馆领事处并导致多名军事人员灭亡,伊朗伊

  8. 8 知名女演员因这事被气进医院……网友:深有感触!

    比来知名童星关凌在社交平台发布了一个视频激发好多网友热议关凌透露,只因为前一天晚上给两娃指点了作文和阅读懂得,究竟晚上睡觉之前就感

本文内容来自网友供稿,如有信息侵犯了您的权益,请联系反馈核实

Copyright 2024.爱妻自媒体,让大家了解更多图文资讯!