HTML 页面源代码布局介绍
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 页面源代码布局介绍的更多相关文章
- WPF面板布局介绍Grid、StackPanel、DockPanel、WrapPanel
回顾 上一篇,我们介绍了基本控件及控件的重要属性和用法,我们本篇详细介绍WPF中的几种布局容器及每种布局容器的使用场景,当 然这些都是本人在实际项目中的使用经验,可能还存在错误之处,还请大家指出. 本 ...
- WPF Step By Step 完整布局介绍
WPF Step By Step 完整布局介绍 回顾 上一篇,我们介绍了基本控件及控件的重要属性和用法,我们本篇详细介绍WPF中的几种布局容器及每种布局容器的使用场景,当 然这些都是本人在实际项目中的 ...
- html5/css3响应式布局介绍及设计流程
html5/css3响应式布局介绍 html5/css3响应式布局介绍及设计流程,利用css3的media query媒体查询功能.移动终端一般都是对css3支持比较好的高级浏览器不需要考虑响应式布局 ...
- 转:CSS3 Flexbox 布局介绍
转:CSS3 Flexbox 布局介绍 Flexbox是一个用于页面布局的全新CSS3模块功能.它可以把列表放在同一个方向(从左到右或从上到下排列),并且让这些列表能延伸到占用可用的空间.较为复杂的布 ...
- AndroidStudio制作登录和注册功能的实现，界面的布局介绍
前言 大家好,给大家带来AndroidStudio制作登录和注册功能的实现,界面的布局介绍的概述,希望你们喜欢 每日一句: Success is connecting with the world a ...
- ( 转)WPF面板布局介绍Grid、StackPanel、DockPanel、WrapPanel
回顾 上一篇,我们介绍了基本控件及控件的重要属性和用法,我们本篇详细介绍WPF中的几种布局容器及每种布局容器的使用场景,当 然这些都是本人在实际项目中的使用经验,可能还存在错误之处,还请大家指出. 本 ...
- UiPath选择器之页面选择器的介绍和使用
一.页面选择器的介绍 某些软件程序的布局和属性节点具有易变的值,例如某些Web应用程序.UiPath Studio无法预测这些变化,因此,您可能必须手动生成一些选择器. 每个属性都有一个分配的值.选择 ...
- Bootstrap~页面的布局
回到目录 Bootstrap作为支持响应式布局的一个前端插件,确实发挥着重要的作用,无论你是在手机,平板还是PC上浏览网页,都能达到不错的效果,这一切一切,都是bootstrap带给我们的! 今天主要 ...
- 关于贴友的一个书本页面简单布局（html+css）的实现
贴友需求:以html+css仿照书本的页面实现布局效果(见图) html代码: 1: <!-- 我的博客:http://www.ido321.com --> DOCTYPE HTML> ...
随机推荐
- mnist手写数字识别(神经网络)
import numpy as np from sklearn.neural_network import MLPClassifier path = 'mnist.npz' f = np.load(p ...
- 【UGUI】 （一）------- 放大镜
在许多游戏或应用中,我们常常看到放大镜的身影,而在Unity里面,制作一个简易的放大镜是非常简单的. 一. 创建一个3DObject 创建一个Cube或者 Cylinder,这里为了更像放大镜一 ...
- Paper Reading - Mind’s Eye: A Recurrent Visual Representation for Image Caption Generation ( CVPR 2015 )
Link of the Paper: https://ieeexplore.ieee.org/document/7298856/ A Correlative Paper: Learning a Rec ...
- 构建树形结构数据(全部构建,查找构建)C#版
摘要: 最近在做任务管理,任务可以无限派生子任务且没有数量限制,前端采用Easyui的Treegrid树形展示控件. 一.遇到的问题 获取全部任务拼接树形速度过慢(数据量大约在900条左右)且查询速度 ...
- Amazon Headlines Update on Activity in US West Coast Ports
According to news reports, freighter cargo may not be offloaded at U.S. West Coast ports from Februa ...
- Factorials 阶乘（思维）
Description N 的阶乘写作N!表示小于等于N的所有正整数的乘积.阶乘会很快的变大,如13!就必须用32位整数类型来存储,70!即使用浮点数也存不下了.你的任务是 找到阶乘最后面的非零位.举 ...
- Summarize to the Power of Two（map+思维）
A sequence a1,a2,…,ana1,a2,…,an is called good if, for each element aiai, there exists an element aj ...
- 0421--"数字口袋精灵app"二次开发（Blackbriar团队开发）
"数字口袋精灵app"二次开发 目录: 一.项目github总仓库推送 二.开发成员 三.分工与合作 四.各模块成果 五.心得墙 六.团队成员贡献分 内容: 一.项目github总 ...
- 按Right-BICEP要求的测试用例
测试方法:Right-BICEP 测试计划 1.Right-结果是否正确? 2.B-是否所有的边界条件都是正确的? 3.P-是否满足性能要求? 4.结果是否有符合要求的20道题目? 5.所得到的最大数 ...
- Beta版软件使用说明
1引言 1 .1编写目的 编写本使用说明的目的是充分叙述本软件所能实现的功能及其运行环境,以便使用者了解本软件的使用范围和使用方法,并为软件的维护和更新提供必要的信息. 1 .2参考资料 1 .3术语 ...