Tag Diagram

You may have noticed that HTML tags come in pairs;

HTML has both an opening tag (<tag name>) and a closing tag (</tag name>).

The only difference between the opening and closing tags is that the closing tag contains an extra forward slash.

Some EXAMPLE HTML tags that might make things clearer: 

<b>Makes text bold</b>

<i>Makes text italic</i>

<h1>Tells the browser that this text is very important -the browser usually

makes this text really big</h1>

<table>Creates an HTML table - think of a spreadsheet</table>

I hope you can see the pattern in the list above.

HTML tags are not just for placing and formatting text, HTML tags can be used to include other things like: animation, video, Flash, audio, and even multimedia programs.

Comparing HTML code and the web page it creates

Let’s start with a very simple web page to make it as easy for you to understand. First lets look at the final page: sample web page

Now that we’ve seen what the page looks like, let’s look at the HTML code used to create the page.

What you should do now is take a little time and compare the HTML page and the page with the code that is used to create the page.

Notice where the tags are and what they are doing.

Some Theory: The structure of an HTML page

An HTML page is divided into two major sections:

1. The head
The head (<head>) section contains underlying information about the page which does not get displayed in the web page (except for the title of the page). It does, however, have an affect on how the web page is displayed.
2. The body
The body (<body>) section: this section contains all the stuff that appears on the actual web page when someone happens to come along with their web browser. We are talking about the actual text, images, flash movies, and so on that people will see. That, of course, means the tags used to format all this stuff are there too…

You will notice that both the head and the body sections of a web site are marked in the HTML page with their respective tags: (<head> </head>) and (<body> </body>).

If the body tag creates the body of an HTML page, and the head tag creates the head of an HTML page, how do you create an HTML page itself? You guessed it, use the HTML tags:

<html></html>

The ‘mother of all tags’ is the HTML (<html>) tag, and like all tags it must have a start tag (<html>) and an end tag (</html>).

The difference between the start and end tags is the forward slash (/), but you already knew that.

Every web page MUST begin and end with the HTML tag, otherwise the web browser (programs like Internet Explorer) will not be able to display the page.

You also have to have the head tags and the body tags. All the other tags are optional.

So the bare-bones HTML page must have these tags and in this order:

<html>

    <head>

        <title>Title of your page</title>

    </head>

    <body>

    </body>

</html>

Lesson 2 Building your first web page: Part 2的更多相关文章

  1. Lesson 2 Building your first web page: Part 1

    In this ‘hands-on’ module we will be building our first web page in no time. We just need to quickly ...

  2. Lesson 2 Building your first web page: Part 3

    Time to build your first HTML page by hand I could go on with more theory and send half of you to sl ...

  3. Building a RESTful Web Service(转)

    Building a RESTful Web Service This guide walks you through the process of creating a "hello wo ...

  4. 【转】Building a RESTful Web Service

    目标 构建一个service,接收如下HTTP GET请求: [plain] view plain copy   http://localhost:8080/greeting 并返回如下JSON格式的 ...

  5. 解读Web Page Diagnostics网页细分图

    解读Web Page Diagnostics网页细分图 http://blog.sina.com.cn/s/blog_62b8fc330100red5.html Web Page Diagnostic ...

  6. 网页细分图结果分析（Web Page Diagnostics）

    Discuz开源论坛网页细分图结果分析(Web Page Diagnostics) 续LR实战之Discuz开源论坛项目,之前一直是创建虚拟用户脚本(Virtual User Generator)和场 ...

  7. Atitit.web三大编程模型 Web Page Web Forms 和 MVC

    Atitit.web三大编程模型 Web Page    Web Forms 和 MVC 1. 编程模型是 Web Forms 和 MVC (Model, View, Controller). 2.  ...

  8. [转]Calling Web Service Functions Asynchronously from a Web Page 异步调用WebServices

    本文转自:http://www.codeproject.com/Articles/70441/Calling-Web-Service-Functions-Asynchronously-from Ove ...

  9. Tutorial: Importing and analyzing data from a Web Page using Power BI Desktop

    In this tutorial, you will learn how to import a table of data from a Web page and create a report t ...

随机推荐

  1. Aspose WorkbookDesigner打开文件异常"Error xml namespace"

    错误描述: 平台是VS2010的.Net Framework 需要用Aspose的WorkbookDesigner打开excel文件的时候产生异常 异常码是Aspose.Cells.Exception ...

  2. Centos6.6 系统优化

    1:最小化安装 2:修改网卡 vim /etc/sysconfig/network-scripts/ifcfg-eth0 DEVICE=eth0HWADDR=52:54:00:0e:c2:c3TYPE ...

  3. vue-cli#2.0项目结构分析

    项目结构 build 构建工具相关的目录 config 配置目录 dist 通过工具打包生成的最终需要上线的目录 node_modules 存放本地开发所有的依赖包的目录 src 源码目录 stati ...

  4. 表达式中含or的赋值

    or用在赋值表达式的时候,不是返回bool值,而是按以下的情况赋值 如果左侧的表达式估值为True,则返回左侧表达式 否则返回右侧表达式 例子: insignificance = 3 or 1 pri ...

  5. [HAOI2015]树上染色（树形dp）

    [HAOI2015]树上染色 题目描述 有一棵点数为 N 的树,树边有边权.给你一个在 0~ N 之内的正整数 K ,你要在这棵树中选择 K个点,将其染成黑色,并将其他 的N-K个点染成白色 . 将所 ...

  6. java用jxl实现导出execl表格

    //先将需要导出的数据放到list中 //然后将list中的数据放到execl表中 @RequestMapping(params="exportExecl") public Str ...

  7. 最多包含2/k个不同字符的最长串

    看这里的解答: http://www.cnblogs.com/grandyang/p/5351347.html 通用解决了2和k的问题.

  8. Tomcat连HBase报错： HTTP Status 500 - java.lang.AbstractMethodError: javax.servlet.jsp.JspFactory.getJspApplicationContext

    Tomcat中连接HBase数据库,启动的时候报错: HTTP Status 500 - java.lang.AbstractMethodError: javax.servlet.jsp.JspFac ...

  9. URL长链接转换为短链接

    URL长链接转换为段链接的工具非常多,可是.小编还是要给大家唠一种方法的: 操作过程例如以下,打开腾讯微博或者其它微,将自己的URL地址值按图片操作:

  10. 改动Android设备信息，如改动手机型号为iPhone7黄金土豪版！

    首先你的手机必需要有ROOT权限,误操作有风险需慎重 请先开启手机的USB调试,防止手机改动后无法启动时导致的无法修复 1.假设你是在手机上改动,直接使用RE文件管理器,编辑/system/build ...