HTML入门例子

HTML入门例子示例

<1>打开记事本:点击"开始"--选择"程序"--选择"附件"--选择"记事本"

<2>输入下面代码(直接拷贝过去就可以啦)

<!DOCTYPE html>
   <html>
       <head>
           <title>欢迎来到我的博客</title>
       </head>

<body>
            <p>第一个HTML实例
                <a href="http://www.cnblogs.com/JSWBK">这是我的博客
                </a>
            </p>
        </body>
     </html>

<3>点击"文件"--选择"保存"--选择文件类型为"所有文件"--文件名输入"frist.html"并选择文件保存地址.(记住一定要把文件的后缀存为.html或.htm,否则网页无法显示)

<4>现在我们可以双击这个文件.看看效果吧 .

现在解释一下上面的例子

  • HTML文件就是一个文本文件.文本文件的后缀名是.txt,而HTML的后缀名是.html.
  • <!DOCTYPE html>代表文档类型,大致的意思就是:这个网页是HTML文档
  • HTML文档中,第一个标签是<html>.这个标签告诉浏览器这是HTML文档的开始(见html标签).
  • HTML文档的最后一个标签是</html>,这个标签告诉浏览器这是HTML文档的终止.
  • <head></head>标签之间的文本是头信息.在浏览器窗口中,头信息是不被显示在页面上的(见head标签).
  • <title></title>标签之间的文本是文档标题,它被显示在浏览器窗口的标题栏(见title标签).
  • <body></body>标签之间的文本是正文,会被显示在浏览器中(见body标签).
  • <p></p>标签代表段落(见p标签).
  • <a></a>定义了一个超链接,用户只要点击了"尽情学习HTML",就可以链接到http://www.dreamdu.com网站(见a标签).

几个问题

我只能使用记事本做编辑器吗?

答:有很多编辑器可以使用,一些所见即所得的编辑器,比如Dreamweaver,Frontpage你可以很容易创建一个页面,而不需要编写代码,但有可能产生一些垃圾代码.

如果你想成为一名熟练的网络程序开发者,我强烈建议你用纯文本编辑器编写代码,这有助于学习HTML基础.当然也可以使用比较强大的文本编辑器,比如:Notepad++EditPlus UltraEdit.

猴子推荐: 编辑网页时可以同时使用Dreamweaver与Notepad++,Dreamweaver的强大功能可以快速的产生大量代码,再通过Notepad++修正完善代码.

我编写完了HTML文件,但是双击后并不能在浏览器中看到结果,为什么?

答:请确认你保存了文件,并且使用了正确的文件名和扩展名,例如:dreamdu.html,并且确认你用浏览器打开的是同样的文件.

我编辑了HTML文件,但是修改结果并没有在浏览器中显示,为什么?

答:浏览器缓存了你原先的页面,所以它不会读取新的页面.你修改了这个页面,浏览器并不知道.请使用"刷新/重载"按钮来强迫浏览器读取编辑过的页面,或按F5反复刷新.

怎么显示文件扩展名?

答:打开"我的电脑"--选择"工具"--选择"文件夹选项"--选择"查看"--去掉"隐藏已知文件类型的扩展名"的对勾.

时间: 2024-10-07 07:22:20

HTML入门例子的相关文章

【Bootstrap Demo】入门例子创建

本文简单介绍下如何来使用 Bootstrap,通过引入 Bootstrap,来实现一个最基本的入门例子. 在前一篇博文[Bootstrap]1.初识Bootstrap 基础之上,我们完全可以更加方便快捷的创建一个的简单例子.这个例子只有基本的东西:引入了预编译版的 CSS 和 JavaScript 文件,页面只包含了一个 container 元素. 在Bootstrap的官方网站的下载页面 http://getbootstrap.com/getting-started/#download ,也有

MINA经典入门例子----Time Server

原文地址 http://blog.sina.com.cn/s/blog_720bdf0501010b8r.html 貌似java的IO.NIO的入门例子都有相关的Time Server Demo.本例为MINA官方Demo翻译过来而已. MINA百科: Apache MINA(Multipurpose Infrastructure for Network Applications) 是 Apache 组织一个较新的项目,它为开发高性能和高可用性的网络应用程序提供了非常便利的框架.当前发行的 MI

JPA入门例子

(1).JPA介绍: JPA全称为Java PersistenceAPI ,Java耐久化API是Sun公司在Java EE 5标准中提出的Java耐久化接口.JPA吸取了当前Java耐久化技能的长处,旨在标准.简化Java目标的耐久化作业.运用JPA耐久化目标,并不是依赖于某一个ORM结构.      为何要运用JAP?      在说为何要运用JPA之前,咱们有必要了解为何要运用ORM技能. ORM 是Object-Relation-Mapping,即目标联系暗射技能,是目标耐久化的中心.O

freemarker入门例子

freemarker入门例子,直接代码如下: FreeMarkerTest import java.io.BufferedWriter; import java.io.File; import java.io.FileWriter; import java.io.IOException; import java.io.Writer; import java.util.ArrayList; import java.util.HashMap; import java.util.List; impor

spring mvc构建WEB应用程序入门例子

在使用spring mvc 构建web应用程序之前,需要了解spring mvc 的请求过程是怎样的,然后记录下如何搭建一个超简单的spring mvc例子. 1) spring mvc的请求经历 请求由DispatcherServlet分配给控制器(根据处理器映射),在控制器完成处理后,请求会被发送到一个视图(根据viewController解析逻辑视图) 来呈现输出结果. 整理成下图所示: 2)搭建一个简单的spring mvc例子 ①创建一个maven工程,其中pom中要有spring相关

【Bootstrap】入门例子创建

本文简单介绍下如何来使用 Bootstrap,通过引入 Bootstrap,来实现一个最基本的入门例子. 在前一篇博文[Bootstrap]1.初识Bootstrap 基础之上,我们完全可以更加方便快捷的创建一个的简单例子. 在Bootstrap的官方网站的下载页面 http://getbootstrap.com/getting-started/#download ,也有提供一些简单的例子.这里打算创建最简单的. 这里先在官网下载需要的基本文件: 下载后解压,可以看到它只包含三个文件夹: 准备工

图解VC++2012编译安装GDAL1.11.0和入门例子

相关下载 http://pan.baidu.com/s/1o7OEMc6 gdal1.rar - 入门例子 GDAL书籍代码及数据.rar gdal1110.zip - 下载的源码 GDAL.rar - 构建成功后的内容 1 进入如下目录执行vcvars32.bat 2 切换到解压目录执行命令 nmake /f makefile.vc,进行编译:时间比较长:可能10几分钟: 完成编译: 3.设置输出目录 找到下载目录中的nmake.opt文件,例如本文的中的文件路径为: D:\gdal-1.11

一个简单的iBatis入门例子

一个简单的iBatis入门例子,用ORACLE和Java测试 目录结构: 1.导入iBatis和oracle驱动. 2.创建类Person.java package com.ibeats;import java.util.Date; public class Person { private int id; private String firstName; private String lastName; private double weightInKilograms; private do

Spring @AspectJ 实现AOP 入门例子(转)

AOP的作用这里就不再作说明了,下面开始讲解一个很简单的入门级例子. 引用一个猴子偷桃,守护者守护果园抓住猴子的小情节. 1.猴子偷桃类(普通类): Java代码   package com.samter.common; /** * 猴子 * @author Administrator * */ public class Monkey { public void stealPeaches(String name){ System.out.println("[猴子]"+name+&quo