0
(0)

通过html基础入门第一课—html概念的学习，我们已经大致知道了html的一些入门基础，今天我和大家一起创建一个简单的html文档，让我们亲自感受下创建网页文档的快感，呵呵。

如果想创建一个新的html文档，建议大家直接用文本编辑，这样写出的代码会很整洁，不会生成冗余代码。

首先，回忆html概念里面我们提到的html的基本结构，html是由一对最大的标签<html></html>包围，所有的html标签和内容都是在这对最大的标签里面的，所以这也是我们称之为html标记语言的一个原因，然后最大的html标签包含的空间又被一分为二，上边一部分是头部（head），下面一部分是身体部分（body），我们先把这个简单的结构书写出来，那就是以下内容：

  1. <html>  
  2. <head>  
  3. 这里是头部……   
  4. </head>  
  5. <body>  
  6. 这里是内容   
  7. </body>  
  8. </html>

我们可以再自己的电脑桌面上新建一个文本文件，然后把上面的代码复制在先创建的文本中，然后把文本文件的后缀名修改为.html或者.htm，保存，你会发现这个时候次文件的图标变成了一个浏览器样式，然后你右击打开方式，选择用相应浏览器打开查看了。

当然以上制作的只是一个简单的html结构，里面没有充实的内容，我们可以往结构里面加入一些东西，让我们的网页文档看起来有血有肉，首先，我们可以在以上文档的头部代码，也就是<head></head>里面给这个网页文档添加一个标题：

  1. <head>  
  2. <title>这是我的第一个网页文档，纪念一下</title>  
  3. </head>  

OK，我们继续，往内容标签中加入两个段落和一个超链接：

  1. <body>  
  2. <p>这是一个段落哦</p>  
  3. <p>这是另一个段落哦</p>  
  4. <a href=“http://www.xuejianzhan.com/”>学建站</a>  
  5. </body>  

然后你发现，刚才我们那个简单的html文件就变成了以下样子：

  1. <html>     
  2. <head>     
  3. <title>这是我的第一个网页文档，纪念一下</title>     
  4. </head>     
  5. <body>     
  6. <p>这是一个段落哦</p>     
  7. <p>这是另一个段落哦</p>     
  8. <a href=“http://www.xuejianzhan.com/”>学建站</a>     
  9. </body>     
  10. </html>    

你做好了吗？

声明：本站分享的WordPress主题/插件均遵循 GPLv2 许可协议（免费开源），相关介绍资料仅供学习参考，实际版本可能会因版本迭代或开发者调整而产生变化，如程序中涉及有第三方原创图像、设计模板、远程服务等内容，应获得作者授权后方可使用。本站不提供该程序/软件的产品授权与技术服务，亦不收取相关费用。