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">
<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概述的更多相关文章
- HTML和xhtml,CSS
索引: 初学者入门书籍 高级进阶书籍 W3C官方手册 网站架构 移动平台网站开发 视频资源 开发工具 初学者入门书籍: 中文电子书 深入浅出html pdf中文版 魅丽的网页设计 JAVA WE ...
- (转) 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 ...
- 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 ...
- 一、CSS概述 二、CSS的选择器(认识) 三、CSS样式和属性(练习) 四、重构商城首页DIV+CSS(页面布局)(重点) 浮动/更改显示方式
一.CSS概述###<1>概念 DIV,就是一个HTML元素,块级元素,通常结合CSS进行页面的布局. CSS,层叠样式表,给HTML元素增强显示. ###<2>作用 样式定义 ...
- Unit02: CSS 概述 、 CSS 语法 、 CSS 选择器 、 CSS声明
Unit02: CSS 概述 . CSS 语法 . CSS 选择器 . CSS声明 my.css p { color: yellow; } demo1.html <!DOCTYPE html&g ...
- HTML、XHTML、css速记
一.HTML 下面内容记录经常使用的html元素.可另存为html文件以查看效果: <!doctype html> <html lang="zh-cn"> ...
- Web前端:1、HTML&CSS概述及结构
万维网联盟(World Wide Web Consortium)简称W3C,专门为了定义网页相关的标准而成立,如网页中的HTML.CSS.DOM.HTTP.XML等标准. 根据W3C标准,一个网页主要 ...
- CSS概述<选择器总结>
概述:CSS是指层叠样式表,他是定义如何显示HTML元素,样式表通常存储在样式表中,通常存储在.css文件中,下面对css的选择器进行总结,便大家夯实基础! 1 语法规范: 每个样式规则有两个部分:选 ...
- python css概述
1. 概述 css是英文Cascading Style Sheets的缩写,称为层叠样式表,用于对页面进行美化. 存在方式有三种:元素内联.页面嵌入和外部引入,比较三种方式的优缺点. 语法:style ...
随机推荐
- vhosts.conf
<VirtualHost *:80> ServerAdmin webmaster@dummy-host.example.com DocumentRoot "/opt/lampp/ ...
- PHP QR CODE生成二维码
用法: <?php include "./phpqrcode/phpqrcode.php"; $value="http://www.xxx.com"; $ ...
- mysql 用户名密码登陆不上
问题1:刚安装完mysql,设置了用户名密码root,登陆OK的,后来再连怎么也连不上了 操作步骤: 输入:mysql -uroot -proot 提示:ERROR 1045 (28000): Acc ...
- jquery、js操作checkbox全选反选
全选反选checkbox在实际应用中比较常见,本文有个不错的示例,大家可以参考下 操作checkbox,全选反选//全选 function checkAll() { $('input[name=&qu ...
- OpenGl从零开始之坐标变换(下)
这节主要来理解投影变换和视口变换的使用. 1.正射投影:glOrtho 函数原型: void glOrtho(GLdouble left,GLdouble right,GLdouble bottom, ...
- spark 连接 mysql 数据库
在所有master和slave上也要在spark/conf/spark-conf.sh里面设置driver的classpath,解决编译找不到driver的问题 http://www.iteblog. ...
- Qt之操作数据库(SQLite)
SQLite 简介 SQLite,是一款轻型的数据库,是遵守ACID的关联式数据库管理系统,它的设计目标是嵌入式的,而且目前已经在很多嵌入式产品中使用了它,它占用资源非常的低,在嵌入式设备中,可能只需 ...
- AI钻石天鹅风格
第1步:描绘轮廓 你需要对你的设计有个总体的概念.利用照片和钢笔工具(P)描出轮廓.把填充颜色设为无,描边颜色设为黑色,1pt 粗细.这将作为你完成剩下设计的指导.编组 (Ctrl+G)你的线条并在图 ...
- VCS之Git
Git -- open source distributed version control system -- A stream of snapshots(if no change,just lin ...
- jsp界面项目绝对路径问题
方法一:直接采用绝对路径 (不推荐) 在JSP页面端,获得本项目的绝对地址(如果你的项目叫MyApp,那么获得到的地址就是 http://localhost:8080/MyApp/): 代码如下: & ...