《xhtmCss.docVIP

第一章 初识XHTML 1.HTML4.01 的文档定义 2.XHTML1.0 的文档定义 3.XHTML1.0 标记格式 1.1 HTML4.01 的文档定义 !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN /TR/html4/loose.dtd 1.2 XHTML1.0 的文档定义 !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN /TR/xhtml1/DTD/xhtml1-transitional.dtd html xmlns=/1999/xhtml HTML 与 XHTML 都有三种标准风格：第一种称为过度型(transitional) ，它允许使用废 弃标记。第二种称为严格型(strict) ，他禁止使用任何废弃的标记。第三种是框架型(frameset)， 它允许使用废弃的标记和框架。 1.3 XHTML1.0 风格标记的改变 1.所有单标记都必须关闭：br / 、hr /、option /等 2.所有的单属性必须等于自身：checked=checked、readonly=readonly等 3.尽可能不使用废弃标记：center 、font等 4.尽可能不使用废弃属性：align、bgcolor 第二章 CSS入门基础 1.认识 CSS 2.传统 HTML 设计网页版面的缺点 3.CSS 的特点 4.CSS 的排版样式 2.1 认识 CSS CSS的英文全名是Cascading Style Sheets,中文可翻译为串接式排版样式, 并且CSS2规范 也于1998年02月通过W3C的审核与推荐,所以CSS并不是专为XHTML所设计的,CSS还可以被其他标记语言拿来制作排版样本, 如 HTML,XML 文件都可以应用 CSS,来美化网页的设计, 大家如果学会 CSS,在 HTML,XHTML,XML 文件中都可以使用. 2.2 传统 HTML 设计网页版面的缺点 使用传统HTML 控制标记来设计网页, 在先天上就无法与排版样本来做比较,因为HTML并非完全着眼在网页排版的功能上, 而这对XHTML而言更是如此,因为XHTML有意将原先HTML 中有关网页版面的标记或属性遗弃不用, 如font,center,color,background,bgcolor 等等, 所以对XHTML文件而言, 其排版与显示的功能比HTML文件更弱, 所以使用XHTML 来设计网页更需要搭配CSS排版样本. 2.3 CSS 的特点 HTML排版时的缺点: 设置麻烦, 修改麻烦, 功能严重不足. CSS 样式排版的优点: 排版属性功能完整, 排版文件可以独立存在, 可以共用排版文件 CSS 样式排版的分类: 行内排版样式,内嵌式排版样式,链接式排版 2.4 CSS的排版样式 行内排版样式: 格式:标记名称 style= ”属性 1:属性值 1;属性 2:属性值 2”…/标记名称 例 :p style= ”font-size:20pt;color:red;text-align:center ”排版样式/p 排版专用标记:div 与span 这两个标签都是用来设置涵盖一个区块为主. 区块就是表示一行以上的数据，span 与/span该数据显示前后都不会跳行. 内嵌式排版样本: 内嵌式排版中所有的样式定义都必须在 style../style 之间, 而style../style 又必须在head../head之间. 与其功能, 又可以分为三种, 1. 标记定义型 2. class定义型 3. id定义型 标记定义型格式: head style type=”text/css ” 标记名称{属性 1:属性值 1;属性 2:属性值 2;} 标记名称{属性 1:属性值 2;属性 2:属性值 2;} /style /head body 标记名称…/标记名称 /body class 定义型格式: head style type=”text/css ” . 定义名称{ 属性 1:属性值 1;属性 2: 属性值 2;} . 定义名称 1,.定义名称 2{ 属性 1:属性值 1;属性 2: 属性值 2;} /style /head body 标记名称 class=”定义名称”…/标记名称 /body id 定义型格式: head style #定义名称{属性 1:属性值 1;属性 2:属性值 2;} #定义名称 1,# 定义名称 2{ 属性 1:属性值 1;属性 2: 属性值 2;} /style /head body 标记名称 id= ”定义名称”…/标记名称 /body