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">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<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>

<meta charset="UTF-8">

<meta name="Generator" content="EditPlus®">

<meta name="Author" content="">

<meta name="Keywords" content="">

<meta name="Description" content="">

<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>

<meta charset="UTF-8">

<meta name="Generator" content="EditPlus®">

<meta name="Author" content="">

<meta name="Keywords" content="">

<meta name="Description" content="">
<title>css的优势</title>

<style type="text/css">

h1{

color:red;

font-size:5px;

}

p{

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语言有了突破性的进展,并且后期修改和维护都十分的方便。(上面用到的是标记选择器)

xhtml和css概述的更多相关文章

  1. HTML和xhtml,CSS

    索引: 初学者入门书籍 高级进阶书籍 W3C官方手册 网站架构 移动平台网站开发 视频资源 开发工具 初学者入门书籍: 中文电子书    深入浅出html pdf中文版 魅丽的网页设计 JAVA WE ...

  2. (转) Web 建站技术中,HTML、HTML5、XHTML、CSS、SQL、JavaScript、PHP、ASP.NET、Web Services 是什么?

    Web 建站技术中,HTML.HTML5.XHTML.CSS.SQL.JavaScript.PHP.ASP.NET.Web Services 是什么? 建站有很多技术,如 HTML.HTML5.XHT ...

  3. Web 建站技术中,HTML、HTML5、XHTML、CSS、SQL、JavaScript、PHP、ASP.NET、Web Services 是什么(转)

    Web 建站技术中,HTML.HTML5.XHTML.CSS.SQL.JavaScript.PHP.ASP.NET.Web Services 是什么?修改 建站有很多技术,如 HTML.HTML5.X ...

  4. 一、CSS概述 二、CSS的选择器(认识) 三、CSS样式和属性(练习) 四、重构商城首页DIV+CSS(页面布局)(重点) 浮动/更改显示方式

    一.CSS概述###<1>概念 DIV,就是一个HTML元素,块级元素,通常结合CSS进行页面的布局. CSS,层叠样式表,给HTML元素增强显示. ###<2>作用 样式定义 ...

  5. Unit02: CSS 概述 、 CSS 语法 、 CSS 选择器 、 CSS声明

    Unit02: CSS 概述 . CSS 语法 . CSS 选择器 . CSS声明 my.css p { color: yellow; } demo1.html <!DOCTYPE html&g ...

  6. HTML、XHTML、css速记

    一.HTML 下面内容记录经常使用的html元素.可另存为html文件以查看效果: <!doctype html> <html lang="zh-cn"> ...

  7. Web前端:1、HTML&CSS概述及结构

    万维网联盟(World Wide Web Consortium)简称W3C,专门为了定义网页相关的标准而成立,如网页中的HTML.CSS.DOM.HTTP.XML等标准. 根据W3C标准,一个网页主要 ...

  8. CSS概述<选择器总结>

    概述:CSS是指层叠样式表,他是定义如何显示HTML元素,样式表通常存储在样式表中,通常存储在.css文件中,下面对css的选择器进行总结,便大家夯实基础! 1 语法规范: 每个样式规则有两个部分:选 ...

  9. python css概述

    1. 概述 css是英文Cascading Style Sheets的缩写,称为层叠样式表,用于对页面进行美化. 存在方式有三种:元素内联.页面嵌入和外部引入,比较三种方式的优缺点. 语法:style ...

随机推荐

  1. Android 高仿腾讯旗下app的 皮肤加载技术

    http://www.cnblogs.com/punkisnotdead/p/4968851.html 以前写的这篇文章 可以高仿出 知乎 新浪微博等 绝大多数app的换肤技术,但是遗漏了腾讯的效果, ...

  2. Android WebView中那些不得不解决的坑~~

    前面那张hybrid开发心得 有人问 怎么解决不用onJsPrompt 来回调js函数的问题.其实很简单,就是在在你的jscalljava回调函数内 另外开个线程去load js代码即可: wb.po ...

  3. Android Bitmap实战技巧

    注:本文大量参考谷歌官方文档自http://developer.android.com/intl/zh-cn/training/displaying-bitmaps/index.html.如果你自学能 ...

  4. 实用js+css多级树形展开效果导航菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. hdu 2897(威佐夫博奕变形)

    题意:容易理解. 分析:当n%(p+q)==0时,先取者必胜,必胜方案:先取q,然后对方去x个,先取者就取(p+q-x)个,最后对方就必须取玩p个, 当n%(p+q)==r(r<=p),先取者必 ...

  6. C#实现CAD数据转shape或mdb

    jojojojo2002 原文C#实现CAD数据转shape或mdb 本文所指的CAD数据为不带空间参考和扩展数据的数据.如果CAD带了空间参考或是扩展属性数据的话,就要采用图形和属性分离的方法转CA ...

  7. Android 中像素px和dp的转化

    在Android的布局文件中,往往使用dp作为控件的宽度和高度尺寸,但是在Java代码中,调用getWidth()方法获得的尺寸单位却是像素px,这两个单位有明显的区别:dp和屏幕的密度有关,而px与 ...

  8. Java并发编程-synchronized

    多线程的同步机制对资源进行加锁,使得在同一个时间,只有一个线程可以进行操作,同步用以解决多个线程同时访问时可能出现的问题.同步机制可以使用synchronized关键字实现.synchronized关 ...

  9. mysql存贮过程编写

    这篇并不是说如何去写存贮过程,只是自己以前在测试过程中主要是查看,获取数据库里的数据,偶尔删除一些脏数据.然后这次因为手动测试组想做一个批量审批的测试,因为流程繁杂,因此想用一种快速的方式去做,于是就 ...

  10. .hpp文件

    hpp在C++中的含义 以前在开源代码里面遇到过,今天看boost源码的时候又遇到了,故学习一下. hPP,计算机术语,用C/C++语言编写的头文件,通常用来定义数据类型,声明变量.函数.结构和类.而 ...