色彩斑斓: CSS教程系列——简单的Html语法

大虾请略过，本人菜鸟。欢迎批评指正。

看到有人留言及在抓虾推荐上一篇文章，深受鼓励，我想自己一定可以把它写完的。欢迎订阅本Blog，以关注最新教程：http://feeds.feedburner.com/eool（推荐）以及http://feed.feedsky.com/ifly

在此系列教程中，我主要是根据自己的学习经历和经验，以最通俗的语言及例子说明一些抽象的概念，相信即使你从来没有接触过Html或CSS都可以学会。另外本教程所介绍的也是最基本的概念及最常用到的知识。

我接触Html也是从Blogger开始的，以前的Blogger模板是纯Html格式的。相信好多朋友连最基本的Html标记都不清楚，在学CSS之前，我将介绍我们最常用到的一些Html标记。算是CSS的基础。

1.Html简介

HTML的英文全称是Hyper Text MarkUp Language，中文叫做“超文本标记语言”。

HTML文件看上去和一般文本类似，但是它比一般文本多了Tag（标记），比如<html>，等，通过这些Tag，可以告诉浏览器如何显示这个文件。我们用记事本就可以编辑Html。

我们平常浏览网页是通过IE,Firefox此类的浏览器，为什么需要浏览器呢？浏览器是一种翻译工具，它会解释看起来复杂、凌乱的Html，让人们得到最直观的表现方式。先介绍一下Html的几个基本概念：（1）标记（Tag），有的地方也称作标签。标记在Html中是用于描述功能的符号。标记是用来实现某种功能的，标记必须用<>括起来.举个例子吧.

一些文字

在上面的一行代码中,和就是标记,那么它们可以实现什么功能呢?这两个标记只有一个差别,就是后面的标记多了一个'/',这个标记的功能就是让两个标记中间的文字加粗显示.我们会注意到在浏览器中标记是不会显示的,显示出来的是它们之间的内容.所以我们可以看出,标记在这儿就起了某种功能的作用,标记指出了处于它们之间的内容在浏览器中的表现方式.

标记一般都有一个“始标记”和一个“尾标记”，像上面例子中就是始标记，带上一个斜线就变成了尾标记。那么为什么需要两个标记呢？只用一个不行吗？其中始标记告诉浏览器从此处开始标记所表示的功能，而尾标记则告诉浏览器到这里该功能结束。相信这是很容易理解的。当然也有一些单标记，比如最常用的单标记 ，它用来表示换行。

新版的Blogger用的是XML，它对标记的检查非常严格，一般标记必须含有结束标记，有时候我们修改了代码却无法保存，或许就是漏了结束标记。

（2）属性。HTML元素可以拥有属性。属性可以扩展HTML元素的能力。

比如你可以使用一个bgcolor属性，使得页面的背景色成为红色，就像这样：

<body bgcolor="red">

（3）注释语句。注释语句的格式为：

2.Html的基本结构

<html>

  <head>

    <title>Title of page</title>

  </head>

  <body>

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

  </body>

</html>

浏览器在解释Html的时候会由上而下执行，像流水一样，这就是以后我们会接触Html的一个“流”的概念，尽管简单，却是基础。

上面的Html基本结构的第一个Tag是<html>，这个Tag告诉你的浏览器这是HTML文件的头。文件的最后一个Tag是</html>，表示HTML文件到此结束。

在<head>和</head>之间的内容，是Head信息。Head信息是不显示出来的，你在浏览器里看不到。但是这并不表示这些信息没有用处。Head信息是预加载的一些信息，比如CSS以及JS就可以放在Head里。

在<title>和</title>之间的内容，是这个文件的标题。你可以在浏览器最顶端的标题栏看到这个标题。

在<body>和</body>之间的信息，是正文。

在和之间的文字，用粗体表示。顾名思义，就是bold的意思。

3.本节最重要的内容，介绍常用的标记。大多数将会在使用的时候简单介绍。Html标记是CSS的样式附着的地方，是“钩子”。

h1,h2等
ul li等
div span p等

色彩斑斓

CSS教程系列——简单的Html语法

3 条评论:

存档

链接