HTML入门

深藏阁楼爱情的钟 2022-07-29 11:42 185阅读 0赞

强烈推荐一个大神的人工智能的教程：[http://www.captainbed.net/zhanghan][http_www.captainbed.net_zhanghan]

# ●简介 #

一说到HTML我首先想到的是网页，我们几乎每天都会和网页打交道，遇到不会的就百度。那么HTML和网页一样吗？原来HTML（Hypertext Markup Language)只是一种语言，而且是一种超文本标记语言。“网页”是指位于Internet而不是在自己计算机硬盘上的页面。网页是用HTML这一特殊的语言编写的命令来添加格式信息、图像和其他媒体信息。

网页看上去就和我们的纸一样，在网页上是点哪就链接到哪一页，而书是翻到第几页显示在眼前的就是第几页。但是他们之间是有区别的，显示在计算机上的页面实际上可能是位于许多不同计算机的文件中的元素集合，例如我们在百度输入小狗，选择图片，出来的网页结果中的信息不是一个计算机中的东西，而是很多元素的集合。我经常会使用百度，对百度的网址已经熟记于心（当然不是故意去记的，重复就是力量嘛），百度的网址是http://www.baidu.com，之前我只是简单的认为这是一个链接，这是一个地址，原来这个网址中还包含了一些知识，，其中的www有他的意义，即万维网（World Wide Web）是Internet上所有网页的统称。

# ●HTML标签 #

<table> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;"> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;标签 &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; </td> 
 <td style="vertical-align:top;"> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;功能 &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; </td> 
 <td style="vertical-align:top;"> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;英文简介 &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;"> &lt;html&gt;…&lt;/html&gt; </td> 
 <td style="vertical-align:top;"> 包含整个HTML文档 </td> 
 <td style="vertical-align:top;"> &nbsp; </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;"> &lt;head&gt;…&lt;/head&gt; </td> 
 <td style="vertical-align:top;"> 包含HTML文档的标题 </td> 
 <td style="vertical-align:top;"> &nbsp; </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;"> &lt;title&gt;…&lt;/title&gt; </td> 
 <td style="vertical-align:top;"> 指明文档的标题，用于&lt;head&gt;内 </td> 
 <td style="vertical-align:top;"> &nbsp; </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;"> &lt;body&gt;…&lt;/body&gt; </td> 
 <td style="vertical-align:top;"> 包含HTML文档的正文 </td> 
 <td style="vertical-align:top;"> &nbsp; </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;"> &lt;p&gt;…&lt;/p&gt; </td> 
 <td style="vertical-align:top;"> 包含一个段落 </td> 
 <td style="vertical-align:top;"> &nbsp;paragraph </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;"> &lt;br/&gt; </td> 
 <td style="vertical-align:top;"> 分行 </td> 
 <td style="vertical-align:top;"> &nbsp;branch </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;"> &lt;hr/&gt; </td> 
 <td style="vertical-align:top;"> 水平标尺线 </td> 
 <td style="vertical-align:top;"> &nbsp;horizontal rule </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;"> &lt;h1&gt;…&lt;/h1&gt; </td> 
 <td style="vertical-align:top;"> 一级标题 </td> 
 <td style="vertical-align:top;"> &nbsp; </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;"> &lt;h2&gt;…&lt;/h2&gt; </td> 
 <td style="vertical-align:top;"> 二级标题 </td> 
 <td style="vertical-align:top;"> &nbsp; </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;"> &lt;a href&gt;…&lt;/a&gt; </td> 
 <td style="vertical-align:top;"> 链接 </td> 
 <td style="vertical-align:top;"> &nbsp;anchor（锚） </td> 
 </tr> 
 </tbody> 
</table>

# ●总结 #

敲牛腩的时候是简单的跟着敲，敲完再看HTML的时候才明白其中的一些排版，其中的一些属性，网页排版和CSS的结合很是有意思，对于HTML和网页的关系也有了初步的了解，网页的排版也是一门艺术，接着去实践吧！

[http_www.captainbed.net_zhanghan]: http://www.captainbed.net/zhanghan