HTML文件是什么？

q  HTML表示超文本标记语言（Hyper Text Markup Language）。

q  HTML文件是一个包含标记的文本文件。

q  这些标记保速浏览器怎样显示这个页面。

q  HTML文件必须有htm或者html扩展名。

q  HTML文件可以用一个简单的文本编辑器创建。

想不想尝试一下？

假如你运行的是windows系统，打开记事本，在其中输入以下文本：

<html>
<head>
   <title>Title of
page</title>
</head>
   <body>
      This is my first homepage.
   <b>This text is bold</b>
   </body>

</html>

将此文件保存为“mypage.htm”。

启动浏览器。在文件菜单中选择“打开”（或者“打开页面”），这时将出现一个对话框。选择“浏览”（或者“选择文件”），定位到你刚才创建的HTML文件——“mypage.htm”，选择它，单击“打开”。然后在对话框中，你将看到这个文件的地址，比如说：“C:\MyDocuments\mypage.htm”。单击“确定”，浏览器将显示此页面。

例子解释:

HTML文档中，第一个标签是<html>。这个标签告诉浏览器这是HTML文档的开始。HTML文档的最后一个标签是</html>，这个标签告诉浏览器这是HTML文档的终止。

在<head>和</head>标签之间文本的是头信息。在浏览器窗口中，头信息是不被显示的。

在<title>和</title>标签之间的文本是文档标题，它被显示在浏览器窗口的标题栏。

在<body>和</body>标签之间的文本是正文，会被显示在浏览器中。

在<b>和</b>标签之间的文本会以加粗字体显示。

关于HTML编辑器：

用一些所见即所得的编辑器，比如frontpage，dreamwaver，你可以很容易创建一个页面，而不需要在纯文本中编写代码。

但是假如你想成为一名熟练的网络开发者，我们强烈推荐你用纯文本编辑器编写代码，这有助于学习HTML基础。

常见问题:

问：我编写完了HTML文件，但是不能在浏览器中看见结果，为什么？
答：请确认你保存了文件，并且使用了正确的文件名和扩展名，例如：“c:\mypage.htm”，并且确认你用浏览器打开时使用同样的文件名。

问：我编辑了HTML文件，但是修改结果并没有在浏览器中显示，为什么？
答：浏览器缓存了你的页面，所以它不需要两次读取同样的页面。你修改了这个页面，浏览器并不知道。请使用“刷新/重载”按钮来强迫浏览器读取编辑过的页面。

HTML元素：

HTML文档是由HTML元素组成的文本文件。
HTML元素是预定义的正在使用的HTML标签。

HTML标签：

HTML标签用来组成HTML元素。

HTML标签两端有两个包括字符：“<”和“>”,这两个包括字符被称为角括号。

HTML标签通常成对出现，比如<b>和</b>。一对标签的前面一个是开始标签，第二个是结束标签,在开始和结束标签之间的文本是元素内容。

HTML标签是大小写无关的，<b>跟<B>表示的意思是一样的。

HTML元素：

回忆一下上面的HTML例子：

<html>
<head>
   <title>Title of
page</title>
</head>
   <body>
      This is my first homepage.
   <b>This text is bold</b>
   </body>

</html>

下面是一个HTML元素：

<b>This text
is bold</b>

此HTML元素以开始标签<b>起始， 内容是：This text is bold，以结束标签</b>中止。<b>标签的目的是定义一个需要被显示成粗体的HTML元素。

下面也是一个HTML元素：

<body>
This is my first homepage.
<b>This text is bold</b>
</body>

此HTML标签以开始标签<body>起始，终止于结束标签</body>。<body>标签的目的是定义一个HTML元素，使其包含HTML文档的主体。

为什么使用小写标签？

我们刚说过，HTML标签是大小写无关的：<B>跟<b>含义相同。当你上网的时候，你会注意到多数教程在示例中使用大写的HTML标签，我们总是使用小写标签。为什么？

假如你想投入到下一代HTML中，你应该开始使用小写标签。W3C在他们的HTML4建议中提倡使用小写标签，XHTML（下一代HTML）也需要小写标签。

标签属性：

标签可以拥有属性。属性能够为页面上的HTML元素提供附加信息。

标签<body>定义了HTML页面的主体元素。使用一个附加的bgcolor属性，你可以告诉浏览器：你页面的背景色是红色的，就像这样：

<body
bgcolor="red">

标签<table>定义了一个HTML表格。使用一个附加的border属性，你可以告诉浏览器：这个表格是没有边框的，代码是：

<table
border="0">

属性通常由属性名和值成对出现，就像这样：name="value"。属性通常是附加给HTML元素的开始标签的。

引号样式：

属性值应该被包含在引号中。双引号是最常用的，但是单引号也可以使用。
在很少情况下，比如说属性值本身包含引号，使用单引号就很必要了。
比如：name='John
"ShotGun" Nelson'。
注意：中文引号跟英文引号是不一样的。上面所指的引号都是英文状态下的引号。

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

  1. Linux 文档与目录结构

    Linux之文档与目录结构   Linux文件系统结构 Linux目录结构的组织形式和Windows有很大的不同.首先Linux没有“盘(C盘.D盘.E盘)”的概念.已经建立文件系统的硬盘分区被挂载到 ...

  2. Linux之文档与目录结构 目录的相关操作 Linux的文件系统

    Linux之文档与目录结构   Linux文件系统结构 Linux目录结构的组织形式和Windows有很大的不同.首先Linux没有“盘(C盘.D盘.E盘)”的概念.已经建立文件系统的硬盘分区被挂载到 ...

  3. Linux之文档与目录结构 (/ 用法, 相对路径,绝对路径)

    Linux之文档与目录结构   Linux文件系统结构 Linux目录结构的组织形式和Windows有很大的不同.首先Linux没有“盘(C盘.D盘.E盘)”的概念.已经建立文件系统的硬盘分区被挂载到 ...

  4. Linux--2 Linux之文档与目录结构、shell基本命令

    一.Linux之文档与目录结构 1.Linux之文档与目录结构 Linux目录结构的组织形式和Windows有很大的不同.Linux没有“盘(如C盘.D盘.E盘)”的概念,而是建立一个根"/ ...

  5. 运维 03 Linux之文档与目录结构

    Linux之文档与目录结构   Linux文件系统结构 Linux目录结构的组织形式和Windows有很大的不同.首先Linux没有“盘(C盘.D盘.E盘)”的概念.已经建立文件系统的硬盘分区被挂载到 ...

  6. LaTeX文档的基本结构

    正文提纲的构建代码及注释: 显示效果: 目录结构与换行的代码及注释: 显示效果: 具体的有关的信息可以具体查看ctex文档,可以在导言区进行全局的设置,比如标题居中设置等.

  7. Linux之文档与目录结构

    Linux文件系统结构 Linux目录结构的组织形式和Windows有很大的不同.首先Linux没有“盘(C盘.D盘.E盘)”的概念.已经建立文件系统的硬盘分区被挂载到某一个目录下,用户通过操作目录来 ...

  8. 5，Linux之文档与目录结构

    Linux文件系统结构 Linux目录结构的组织形式和Windows有很大的不同.首先Linux没有“盘(C盘.D盘.E盘)”的概念.已经建立文件系统的硬盘分区被挂载到某一个目录下,用户通过操作目录来 ...

  9. linux文档与目录结构

    Linux文件系统结构 本文转自 https://www.cnblogs.com/pyyu/p/9213237.html Linux目录结构的组织形式和Windows有很大的不同.首先Linux没有“ ...

随机推荐

  1. MYSQL存储过程及事件

    关于mysql下的存储过程以及事件的创建 以下这个存储过程主要实现的功能就是查询表里面半年前的数据,假设有就存到文件.然后将数据删除. CREATE DEFINER = `root`@`localho ...

  2. docker中的link

    一.查看容器的详细情形 docker inspect 容器id/名称 二.为什么要用link 容器每次重启时,ip都会变动,这不利于前端引用中连接数据库. 三.link docker run -p 8 ...

  3. Bitmap和Drawable的互相转换

    刚好之前的项目实用到.怕遗忘了.就先记录下来.然后会用到的时候直接来这copy使用就好了. 1.Bitmap ---->Drawable: public static Drawable bitm ...

  4. JSP语法学习笔记

    1.修改JSP页面模版:找到MyEclips安装目录,搜索“Jsp.vtl”,找到该文件修改编码,以及一些不需要用到的代码. 2.查找项目生成的Servlet文件路径:查看当前项目父级目录搜索 .me ...

  5. 【PHPmailer】发送邮件（以163邮箱为例）

    1.参考TP社区:http://www.thinkphp.cn/code/989.html 2.phpmailer.rar下载地址:http://www.thinkphp.cn/code/downlo ...

  6. Objective-C之定义函数

    Demo1.m 一个基础的函数定义 #import<Foundation/Foundation.h> //定义一个返回值为int类型的,名为max的函数.传入的参数为两个int型数据 in ...

  7. pandas drop_duplicates

    函数 : DataFrame.drop_duplicates(subset=None, keep='first', inplace=False) 参数:这个drop_duplicate方法是对Data ...

  8. C#Virtual和Override的几种组合

    情况1: class A{public void Show()} class B:A{public void Show()} 编译通过,有警告让在B的方法里添加new关键字,以便将A的方法隐藏 编译时 ...

  9. Mac上的学习神器：Marginnote

    https://marginnote.com/?lang=zh-hans 技巧1:合并 多选编辑 - 按顺序选择多个块 - 左下角菜单 - 合并 技巧2:管理顺序 双击图片并且按住不放,即可拖拽顺序 ...

  10. 点滴积累【C#】---错误日志记录到txt文本里。

    效果: 描述:将系统中的错误信息,try catch到日志里面. 代码: [后端代码] using System; using System.Collections.Generic; using Sy ...