xhtml和css概述

Xhtml和css概述

1、html的过渡到xhtml

html与xhtml不是两种语言，它们是一种语言的不同阶段，有点类似于文言文和白话文之间的关系。
因为网络技术的日新月异，html的不断改进，所以说xhtml是html的“严谨版”。

详情了解html介绍：http://baike.baidu.com/link?url=XZg9Djt-snnwAICod0SKPbXVhm7BqfTrnEUE2As9E201oL8X7mGbLp7hIsXGV5M6hkcb7gBqWY2NTF-d3dY6Za

（1）<!DOCTYPE>的含义与选择
由于同时存在不同的规范和版本，因此为了使游览器能够兼容多种规范，规范中规定可以使用DOCTYPE指令来声明使用哪种规范解释该文档。
举个例子：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>无标题文档</title>

</head>

<body>

主体

</body>

</html>

**上面有两行红色字体关于DOCTYPE（文本类型）的声明，它是告诉浏览器使用XHTML 1.0的过渡规范来解释这个文档中的代码。
**第三行中，<html>标记带有一个xmlns属性，它称为“xml命名空间”，具体含义不用深究，不用修改，只要照抄即可。
**注意这段声明的位置在最开头。

（2）实际上，XHTML 与 HTML 4.01 标准没有太多的不同。

它们最主要的不同：

*“标签名称”、“属性名称”必须用小写字母。

错误：<P>this is example.<P>

正确：<p>this is example.</p>

*XHTML 元素必须被正确地嵌套。

错误：<p><span>this is example.</p></span>

正确：<p><span>this is example.</span></p>

*XHTML 元素必须被关闭。

错误：<p>this is example.

正确：<p>this is example.</p>

*空标签也必须被关闭。

错误：<br>

正确：<br/>

*XHTML 文档必须拥有根元素。

所有的 XHTML 元素必须被嵌套于 <html> 根元素中。

*XHTML 中属性值必须用双引号括起来。
错误：<p class="heading">
正确：<p class="heading">

2、CSS 概述

** CSS （中文名）：层叠样式表 (Cascading Style Sheets)

** css的引入就是为了使html语言更好地适应页面的美工设计
（1）
** 传统的html语言要实现页面的美工设计是十分麻烦的

例如：<h1><font color="red" face="黑体">css标记1</font><h1>

html：

<!doctype html>

<html >

<head>

<title>html的缺点</title>

</head>

<body>

<h1><font color="red"size="5" >css简介</font><h1>
<p>
<font color="red"size="3" >
HTML 标签原本被设计为用于定义文档内容。通过使用 <h1>、<p>、<table> 这样的标签，HTML 的初衷是表达“这是标题”、“这是段落”、“这是表格”之类的信息。同时文档布局由浏览器来完成，而不使用任何的格式化标签。
</font>
</p>
<p>
<font color="red"size="3" >
由于两种主要的浏览器（Netscape 和 Internet Explorer）不断地将新的 HTML 标签和属性（比如字体标签和颜色属性）添加到 HTML 规范中，创建文档内容清晰地独立于文档表现层的站点变得越来越困难。为了解决这个问题，万维网联盟（W3C），这个非营利的标准化联盟，肩负起了 HTML 标准化的使命，并在 HTML 4.0 之外创造出样式（Style）。
</font>
<p>

</body>

</html>

css的优势:

<!doctype html>

<html >

<head>

h1{

color:red;

font-size:5px;

}

color:red;

font-size:3px;

}

</style>
</head>

<body>

<h1>css简介<h1>

<p>
HTML 标签原本被设计为用于定义文档内容。通过使用 h1、p、table 这样的标签，HTML 的初衷是表达“这是标题”、“这是段落”、“这是表格”之类的信息。同时文档布局由浏览器来完成，而不使用任何的格式化标签。
</p>

<p>
由于两种主要的浏览器（Netscape 和 Internet Explorer）不断地将新的 HTML 标签和属性（比如字体标签和颜色属性）添加到 HTML 规范中，创建文档内容清晰地独立于文档表现层的站点变得越来越困难。为了解决这个问题，万维网联盟（W3C），这个非营利的标准化联盟，肩负起了 HTML 标准化的使命，并在 HTML 4.0 之外创造出样式（Style）。
</p>

</body>

</html>

从上面这个很简单的例子中可以明显看出，css对于网页的整体控制单纯的html语言有了突破性的进展，并且后期修改和维护都十分的方便。(上面用到的是标记选择器)

相关文章