http://www.cnblogs.com/polk6/archive/2013/05/10/3071451.html

此介绍以google首页源代码截图为例:

从上到下依次介绍:

1.<!DOCTYPE html>

此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。

XHTML规范:必须小写,有开始结束标签,属性也用双引号。

HTML规范:不区分大小写,有开始和结束标签,也可把结束标签放在开始标签里,如:<input type='text' /> 。属性可用双引号、单引号(必须配对使用)。

2.HTML 节点:HTML页面的根节点,页面的代码信息都放在这个节点里。

<head> 节点:头部节点。包含以下子节点:

  <mete> 标签:提供页面的元信息(meta-information),比如页面关键字;

  <title> 标签:页面的标题;

  <script> 标签:一般存放Css和JavaScript代码的区域;

<Body> 节点:页面内容区域,存放html各元素信息

  <Div> 标签 : 存放各元素控件。

  <script> 标签:因为Html页面是从上到下加载,不是加载完再一次性显示内容,而是一边加载一边展示内容。

把Script放在body的后面,类似于说明此Script里的代码要调用body里的元素。若放在Head标签里,运行到此script代码时,body里的元素还没有加载,会获取不到所需的元素信息。

==================================系列文章==========================================

本篇文章:1.1 HTML 页面源代码布局介绍

HTML 页面源代码布局介绍的更多相关文章

  1. WPF面板布局介绍Grid、StackPanel、DockPanel、WrapPanel

    回顾 上一篇,我们介绍了基本控件及控件的重要属性和用法,我们本篇详细介绍WPF中的几种布局容器及每种布局容器的使用场景,当 然这些都是本人在实际项目中的使用经验,可能还存在错误之处,还请大家指出. 本 ...

  2. WPF Step By Step 完整布局介绍

    WPF Step By Step 完整布局介绍 回顾 上一篇,我们介绍了基本控件及控件的重要属性和用法,我们本篇详细介绍WPF中的几种布局容器及每种布局容器的使用场景,当 然这些都是本人在实际项目中的 ...

  3. html5/css3响应式布局介绍及设计流程

    html5/css3响应式布局介绍 html5/css3响应式布局介绍及设计流程,利用css3的media query媒体查询功能.移动终端一般都是对css3支持比较好的高级浏览器不需要考虑响应式布局 ...

  4. 转:CSS3 Flexbox 布局介绍

    转:CSS3 Flexbox 布局介绍 Flexbox是一个用于页面布局的全新CSS3模块功能.它可以把列表放在同一个方向(从左到右或从上到下排列),并且让这些列表能延伸到占用可用的空间.较为复杂的布 ...

  5. AndroidStudio制作登录和注册功能的实现,界面的布局介绍

    前言 大家好,给大家带来AndroidStudio制作登录和注册功能的实现,界面的布局介绍的概述,希望你们喜欢 每日一句: Success is connecting with the world a ...

  6. ( 转)WPF面板布局介绍Grid、StackPanel、DockPanel、WrapPanel

    回顾 上一篇,我们介绍了基本控件及控件的重要属性和用法,我们本篇详细介绍WPF中的几种布局容器及每种布局容器的使用场景,当 然这些都是本人在实际项目中的使用经验,可能还存在错误之处,还请大家指出. 本 ...

  7. UiPath选择器之页面选择器的介绍和使用

    一.页面选择器的介绍 某些软件程序的布局和属性节点具有易变的值,例如某些Web应用程序.UiPath Studio无法预测这些变化,因此,您可能必须手动生成一些选择器. 每个属性都有一个分配的值.选择 ...

  8. Bootstrap~页面的布局

    回到目录 Bootstrap作为支持响应式布局的一个前端插件,确实发挥着重要的作用,无论你是在手机,平板还是PC上浏览网页,都能达到不错的效果,这一切一切,都是bootstrap带给我们的! 今天主要 ...

  9. 关于贴友的一个书本页面简单布局(html+css)的实现

    贴友需求:以html+css仿照书本的页面实现布局效果(见图) html代码: 1: <!-- 我的博客:http://www.ido321.com --> DOCTYPE HTML> ...

随机推荐

  1. 自动化运维工具saltstack01 -- 之SaltStack介绍、安装与基础使用

    SaltStack介绍 官网地址:http://www.saltstack.com 官方文档地址:http://docs.saltstack.com Github:http://Github.com/ ...

  2. SQL行列乾坤大挪移

    “生活总是这样,有时候,你需要一个苹果,但别人却给了你一个梨.” 今天dalao邮件里需要添加一张每月累计长长的图,可是,拿到手上的SQL导出数据不符合我最爱的pyecharts的数据输入格式,头大. ...

  3. elasticserach + kibana环境搭建

    一.java环境安装: 1.安装jdk,点击下一步即可. 2.环境变量配置 1) 找到jdk安装目录:C:\Program Files\Java\jdk1.8.0_161 2) 配置环境变量 ①找到环 ...

  4. Hyperledger Fabric CouchDB as the State Database——使用CouchDB

    使用CouchDB作为状态数据库 状态数据库选项 状态数据库包括LevelDB和CouchDB.LevelDB是嵌入在peer进程中的默认键/值状态数据库,CouchDB是一个可选的外部状态数据库.与 ...

  5. Selenium WebDriver 下 plugin container for firefox has stopped working

    用selenium 的webdriver 和 firefox 浏览器做自动化测试,经常会出现 plugin container for firefox has stopped working 如下图所 ...

  6. linux-sftp-指定端口号登录远程主机

    sftp -oPort=60001 root@192.168.0.254 -o选项来指定端口号 -oPort=远程端口号

  7. 【Leetcode】113Path Sum II

    Given a binary tree and a sum, find all root-to-leaf paths where each path's sum equals the given su ...

  8. 微信小程序 对接口常用

    @import '../expert/expert.wxss';   FZ._get('https://didu2.didu86.com/issun/index.php/Home/goodstype/ ...

  9. 编码转换,基础,copy

    阅读目录 编码转换 基础补充 深浅拷贝 文件操作 一,编码转换 1. ASCII : 最早的编码. ⾥⾯有英⽂⼤写字⺟, ⼩写字⺟, 数字, ⼀些特殊字符. 没有中⽂, 8个01代码, 8个bit, ...

  10. Docker 入门 到部署Web 程序- (阿里面试常用的docker命令和优点)

    最近阿里的面试官问我Docker是做什么用的,我记得之前360和美团,京东的都问过,但是一直没时间看,最近有时间了,系统的学习了一下Docker,在此做一下记录,方便各位看官学习交流 一.Docker ...