下面对HTML文档结构进行一 一解释:

1.文档声明:既不是元素,也不是注释;

代码格式:<! DOCTYPE html>

注:必须写在HTML文档的第一行
  原因:告诉浏览器使用哪个版本的HTML进行解析,如果不写,浏览器也会进行解析,在渲染页面时会进入怪异模式;

2.html元素:该元素也叫根元素、根标记,它是所有元素的祖元素,且文档中的所有元素都必须放在它的元素内容中
          相关属性:lang是英语language的缩写,意思是语言,”en”代表英语,”zh-CN”代表中文。
           打开一个外国网站时,浏览器会提示”是否将网页内容翻译成中文”,如下图:

                    

       lang元素为文档设定主语言,如果语言设置好,那么HTML文档就会被搜索引擎更有效地索引。
代码格式:<html lang="en"></html>
     <html lang="zh-cmn-Han-s"></html>

3.head元素:也叫做文档头,它是html的第一个子元素。文档头可以包含一元素,用于描述页面的附加信息(meta、title.....)
   <meta>:空元素,标识页面的其他元素数据;
 代码格式:<meta charest="UTF8">
      charset=”utf-8”是告知浏览器此页面属于什么字符编码格式,下一步浏览器做好“翻译”工作。
   <title>:标识文档标题,该标题会显示在浏览器的标签页或标题栏上。
 注:<meta>元素是head的第一个子元素;
4.body元素:叫做文档体,网页中所有可见的元素都放置在body内;

HTML文档结构的更多相关文章

  1. HTML5的文档结构和新增标签

    一.HTML5 文档结构1.第一步:打开 开发工具,打开指定文件夹:2.第二步:保存 index.html 文件到磁盘中,.html 是网页后缀:3.第三步:开始编写 HTML5 的基本格式.< ...

  2. Win 10 开发中Adaptive磁贴模板的XML文档结构,Win10 应用开发中自适应Toast通知的XML文档结构

    分享两篇Win 10应用开发的XML文档结构:Win 10 开发中Adaptive磁贴模板的XML文档结构,Win10 应用开发中自适应Toast通知的XML文档结构. Win 10 开发中Adapt ...

  3. Mongodb:修改文档结构后出现错误:Element '***' does not match any field or property of class ***.

    Mongodb:修改文档结构后出现错误:Element '***' does not match any field or property of class ***. Mongodb是一种面向文档的 ...

  4. 读取XML文档结构并写入内容

    1.在项目中新建XML文档结构.xsd文件,在其中添加相应的节点. 2.读取文档结构并写入内容 string initFileName = @"D:\Config.xml"; Da ...

  5. MFC开发上位机到底用Dialog结构还是文档结构?

    最近要跟着导师一起开发一款大型上位机.MFC新人在考虑用对话框结构还是文档结构. 虽然说书上说大型结构的软件都需要文档结构,但是目前来看,对话框可以实现功能,并且对话框的程序更小一些,节省资源加载速度 ...

  6. MongoDB学习笔记(四) 用MongoDB的文档结构描述数据关系

    MongoDB的集合(collection)可以看做关系型数据库的表,文档对象(document)可以看做关系型数据库的一条记录.但两者并不完全对等.表的结构是固定的,MongoDB集合并没有这个约束 ...

  7. HTML5的文档结构

    HTML5的文档结构 HTML5简化了许多,它的设计遵循了3个原则:1.兼容性.2.实用性.3.通用访问性     1. header 元素     <header> 标签定义文档或者文档 ...

  8. Poi之Word文档结构介绍

    1.poi之word文档结构介绍之正文段落 一个文档包含多个段落,一个段落包含多个Runs,一个Runs包含多个Run,Run是文档的最小单元 获取所有段落:List<XWPFParagraph ...

  9. HTML的概念和三大基石以及标准文档结构

    HTML的概念: 概念:  HTML:超文本标记语言 作用:  需要将java在后台根据用户请求处理的请求结果在浏览器中显示给用户.  在浏览器中数据需要使用友好的格式展示给用户.  HTML是告诉浏 ...

随机推荐

  1. 利用android studio 生成 JNI需要的动态库so文件

    JNI:  Java Native Interface,  提供了java语言和其他语言(例如c和c++)进行相互调用的方式. 本文是用java调用c生成的so模式.其中,编译so文件过程如下: 1) ...

  2. pwnable.tw applestore

    存储结构 0x804B070链表头 struct _mycart_binlist { int *name; //ebp-0x20 int price; //ebp-0x1c struct _mycar ...

  3. pwnable.tw start&orw

    emm,之前一直想做tw的pwnable苦于没有小飞机(,今天做了一下发现都是比较硬核的pwn题目,对于我这种刚入门?的菜鸡来说可能难度刚好(orz 1.start 比较简单的一个栈溢出,给出一个li ...

  4. powerdesigner添加mysql的字符集ENGINE和DEFAULT CHARACTER SET

    工具栏->database->edit current DBMS 然后,选中:MYSQL50::Script\Objects\Table\Options 在options末尾添加: ENG ...

  5. ABP学习之路--切换mysql数据库

    1.添加mysql相关引用 注意,使用最新版本会导数据迁移时出错 2.修改链接字符串: <add name="Default" connectionString=" ...

  6. spring security5.0源码导入idea

    资源路径:链接:https://pan.baidu.com/s/1Xep6hzyIF2a0AtFYDeO_bw提取码:6af8 1.解压源码 2.编译源码     windows下:直接双击gradl ...

  7. JS一直是单线程,异步(定时器,ajax请求等)是由浏览器来实现的!(转)

    原文地址:https://www.cnblogs.com/woodyblog/p/6061671.html 1.自己画的一张示意图 2.DOM一变化,界面就立刻重新渲染,效率必然很低,所以浏览器的机制 ...

  8. 安装vue错误详情解决办法

    寄语:vue的安装不是理想化的,会出现很多问题,需要静下心认真研究,熬过去就会懂得更多,以下是我遇到的问题和最真挚的建议,按照我的方法不会出错,一定会成功,我尝试了很多次方式,查阅了很多资料,最终总结 ...

  9. 第一个 Python 程序

    ## 目标 * 第一个 `HelloPython` 程序* `Python 2.x` 与 `3​​.x` 版本简介* 执行 `Python` 程序的三种方式 * 解释器 —— `python` / ` ...

  10. TP-Shop安装步骤教程(Windows版)

    TP-Shop安装步骤教程(Windows版) PS:首次发文,请多指教! 一.安装要求 1.PHP5.4以上,MYsql5.5以上. 2.需要Phpcurl,gd库.php_mysqli,php_o ...