HTML的基础入门

来源：互联网发布：python程序员工资编辑：程序博客网时间：2024/06/05 20:55

本章目标

明白HTML是什么，并对它有一些基本的了解。

什么是HTML

HTML是英文Hyper Text Mark-upLanguage(超文本标记语言)的缩写，它规定了自己的语言法则，用来表示比“文本”更丰富的意义，比如图片，表格，链接等。

HTML是什么样的

简单来说，HTML的语法就是给文本加上表明文本含义的标签（Tag）,让用户（人或程序）能对文本得到更好的理解。HTML标签就是转载网页文件所有内容，包括看到或看不到的。下面一个最简单的HTML文档：

<html>

<head>

<title>第一个HTML文档</title>

</head>

<body>

欢迎访问<ahref="http://www.csdn.net">国内最大中文IT社区</a>!

</body>

<html>

所有的HTML文档都会有<html>标签，<html>标签可以包含两个部分：<head><body>.

<head>标签用于包含整个文档的一般信息，比如文档的标题（<title>标签用于包含标题），对整个文档的描述，文档的关键字等等。文档的具体内容就要放在<body>标签里了。

<a>标签用于表示连接，在浏览器（如谷歌，IE，Firefox等）中查看HTML文档时，点击<a>标签括起来的内容时，通常会跳转到另一个页面。这个压迫跳转到的页面的地址有<a>标签的href属性指定。如上面的<ahref="http://www.csdn.net">中，href属性的值就是http://www.csdn.net.

1、HTML语言内容丰富，从功能上大体可分为：文本设置、列表设置、列表建立、文本属性指定、超链接、图片和多媒体插入、对象、表格。表单的操作，以及框架的建立。

2、DOCTYPE:文档类型

DTD(Document Type Definition):文档类型定义

声明位于文档中的最前面的位置，处于<html>标签之前。此标签可告知浏览器文档使用哪种 HTML或XHTML规范。

3、网页的基本元素：

文字：网页上传达信息的主体

图像：视觉印象比文字强烈，可以用来制作标题、背景、主图、和连接按钮等。

超链接：一个网页和另一个目的地（网页、图片、文件、程序）的连接点，可以分为文本超链接和图像超链接。

4、Head标签：

作用：用于存放：

title,meta,base,style,script,link

注意在head标签中我们必须要设置的标签是title

5、Body标签：

作用：页面在的主体部分，用于存放所有的html标签：

p,h,a,b,u,i,s,em,del,ins,strong,img

6、title标签：

作用：页面在的主体部分，用于存放所有的heml标签：

有什么作用：

title中的文本在seo中占有很大的权重。

7、meta标签：

注意：meta中设置的所有的内容在页面都不会显示，可写可不写，但是非常重要，搜索引擎能够搜索得到。

常用标签介绍

文本

最常用的应该是<font>了，它用于改变字体、字号、文本颜色。

加粗，下划线，斜体字也是常用的文字效果，它们分别用<b>,<u>,<i>表示：

<i>italic</i>

<u>underline</u>

还有就是一些标签，是用来指出包含的文本有特殊的意义，比如<abbr>（表示缩写），<em>(表示强调)，<strong>(表示更强地强调)，<cite>(表示引用)，<address>(表示地址等等)。这些标签不是为了定义显示效果而存在的，所以从浏览器里看它们可能没有任何效果，也可能不同的浏览器对这些标签的显示效果完全不同。

一片很长的文章，如果有合适的小标题的话，就可以快速地对它的内容进行大致的了解。在HTML里，用来表示标题的标签有：<h1>,<h2>,<h3>,<h4>,<h5>,<h6>,它们分别表示一级标题，二级标题，三级标题...

<h1>HTML入门教程</h1>

<h2>什么是HTML</h2>

<h3>HTML是什么样的<h3>

...

图片

<hr>标签用于在页面上添加横线。可以通过制定width和color属性来控制横线的长度和颜色。

链接

超级链接用<a>标签表示，href属性指定了链接到的地址。<a>标签可以包含文本，也可以包含图片。

<ahref="http://www.baidu.com">百度</a>

<a href=“http：deerchao.net”>Unibetter大学生论坛</a>

分段与换行

由于HTML文档会忽略空白符，所以想保持正常的分段换行的话，就要指出哪些文字是属于统一段落的，这时就用到<p>标签啦！

<p>这是第一段</p>

<p>这是第二段</p>

也有的人不用<p>，而用<br>。<br>只表示换行，不表示段落的开始或结束，所以通常没有结束标签。

这是第一段。<br>

这是第二段。<br/>

这是第三段。

有时，要把文档看做不同的部分组合起来，不如一个点典型的页面可能包括三个部分：页头，主体，页脚。 <div>标签专门用于标明不同的部分：

表格

HTML文档在浏览器里通常是从左到右，从上到下显示的，到了窗口右边就自动换行。为了实现分栏的效果，很多人使用表格（<table>）进行页面排版(虽然HTML里提供表格的本意不是为了排版)。

<table>标签里通常会包含几个<tr>标签，<tr>代表表格里的一行。<tr>标签又会包含<td>标签，每个<td>代表一个单元格。

<table>

<tr>

<tr>

<tr>

<tr>

</table>

<tr>标签还可以被<table>里的<thead>或<tbody>或<tfoot>包含。它们分别代表表头，表正文，表脚。在打印网页的时候，如果表格很大，一页打印不完，<thead>和<tfoot>讲在每一页出现。

<th><td>非常相似，也用在<tr>里边，不同的是<th>代表这个单元格是它所在的行或列的标题。

<table>

<thead>

</thead>

<tbody>

</tbody>

</table>

这篇文章就是让没有接触过html的人对html有一个初步的了解，所以很多东西也都没有谈到。稳重也并没有把所有的标签都列出来，对于列出来的标签页没有介绍它们的全部属性。另外，没有提到的还有很重要的css，javascript，XHTML,XML,Web Standars,以及它们对与HTML的关系。不过这些也不可能短时间就可以学会，不过只要入了门，就能利用晚上的很多资源继续学习。当然，如何有一本纸质书自学，就更好啦。

以上就是我这次想分享给大家的知识点，写出了的例子大家也要好好的跟着去打一遍，能够在其中学到一些知识是最好的事情，希望大家能够越来越好，往后我还会继续写这类的文上来，希望多多关注。

阅读全文

0 0