什么是CSS?

html-css016

什么是CSS?,第1张

级联样式表(Cascading Style Sheet)简称“CSS”,通常又称为“风格样式表(Style Sheet)”,它是用来进行网页风格设计的。比如,如果想让链接字未点击时是蓝色的,当鼠标移上去后字变成红色的且有下划线,这就是一种风格。通过设立样式表,可以统一地控制HTML中各标志的显示属性。级联样式表可以使人更能有效地控制网页外观。使用级联样式表,可以扩充精确指定网页元素位置,外观以及创建特殊效果的能力。

CSS简介

CSS是英语Cascading Style Sheets(层叠样式表单)的缩写,它是一种用来表现HTML或 XML 等文件式样的计算机语言。 CSS目前最新版本为CSS5,能够真正做到网页表现与内容分离的一种样式设计语言。相对于传统HTML的表现而言,CSS能够对网页中的对象的位置排版进行像素级的精确控制,支持几乎所有的字体字号样式,拥有对网页对象盒模型的能力,并能够进行初步交互设计,是目前基于文本展示最优秀的表现设计语言。

编辑本段级联样式表简介

有三种方法可以在站点网页上使用样式表: 将网页链接到外部样式表。 在网页上创建嵌入的样式表。 应用内嵌样式到各个网页元素。 每一种方法均有其优缺点: 当要在站点上所有或部份的网页上一致地应用相同样式时,可使用外部样式表。在一个或多个外部样式表中定义样式,并将它们链接到所有网页,便能确保所有网页外观的一致性。如果人们决定更改样式,只需在外部样式表 — 中作一次更改 — 而该更改会反映到所有与该样式表相链接的网页上。通常外部样式表以 .css 做为文件扩展名,例如 Mystyles.css。 当人们只是要定义当前网页的样式,可使用嵌入的样式表。嵌入的样式表是一种级联样式表,“嵌”在网页的 <HEAD>标记符内。嵌入的样式表中的样式只能在同一网页上使用。 使用内嵌样式以应用级联样式表属性到网页元素上。 如果网页链接到外部样式表,为网页所创建的内嵌的或嵌入式样式将扩充或覆盖外部样式表中的指定属性。

现在创建和编辑css更加常用的是Adobe Dreamweaver[1]系列软件,可视化编辑更利于web工程师快速的创建和编辑css,新版本CS5.0、CS5.5、CS6,包含Adobe BrowserLab[2],用于针对多种浏览器测试css的兼容性。Adobe Dreamweaver是一个css创建和编辑必不可少的利器! FrontPage 2000 包含有能用来为站点创建外部样式表的模板。可以用空白模板或已包含样式的模板来创建(例如 Arcs)。当保存样式表时, FrontPage 会以 . css 作为文件扩展名。要编辑样式表,请双击文件夹列表中的样式表。 当创建或修改网页样式时,可使用位于 “格式” 菜单的 “样式” 命令,FrontPage 会自动创建嵌入的样式表(如果原先不存在),并在嵌入的样式表内将此样式保存为类选择器。 可以使用 “样式” 对话框来创建新类选择器,修改或删除现有类选择器,或将 CSS 格式设置属性应用到标准 HTML 标记符上例如 <H1>。当单击 “确定” 关闭对话框时,FrontPage 会将格式设置特征写回到使用正确语法的外部或嵌入的样式表中。或者,可以用正确 CSS 语法键入样式信息。要键入嵌入的样式表的样式信息,请单击网页视图模式下的 “HTML” 选项卡。 如果对应用到站点的主题选择 “应用 CSS ” 复选框,FrontPage 将在站点的根目录下创建名为 Theme 1 .css 的文件,其中 Theme 是主题的名称。如果修改主题,FrontPage 自动将更改写回主题 CSS 里。也可以通过直接编辑主题 CSS 来修改主题。

要在网页上使用外部样式表的样式,可将该网页链接到样式表,方法是使用位于 “格式” 菜单上的 “样式表连接” 命令。可以链接一个或数个样式表到网页视图模式下的当前网页,或到在文件夹列表中的所选网页,或到站点上的全部网页。 该“样式” 框列出标准 HTML 标记符,例如标题 1,还有嵌入的样式表或链接到网页的外部样式表中所含的类或 ID 选择器。要应用样式到网页元素,请选定该样式然后单击 “样式” 框中的样式或选择器。 在 Microsoft FrontPage 2000 中,某些格式设置特性会作为内嵌样式自动应用。例如∶如果使用 “边框与阴影” 命令(在 “格式” 菜单上)在普通段落周围应用框,FrontPage 会写下格式设置信息,作为段落标记符的内嵌样式属性(例如∶ <p style="border-style: solid">)。然而某些属性的应用需要使用 CSS,其他则需要使用 HTML 。如果人们只想使用 CSS 应用内嵌样式,可使用 “样式” 按钮(位于网页元素的 “属性” 对话框里)应用类或 ID 选择器或嵌入式样式。

HTML是目前最流行的网页制作语言。互联网中的网页大多数都是使用HTML格式展示在浏览者面前的。随着Web 2.0概念的提出,要求网页具有更好的扩展性和用户体验,这使得CSS样式表在网页设计中变得越来越重要。为了能让广大的网页制作者快速地掌握网页制作的技巧和方法,本书的第一部分以语法和实例相结合的形式详细讲解了HTML语言中各个元素及其属性的作用、语法和显示效果。第二部分从CSS基本概念开始,分别讲解了CSS盒模型和定位属性,CSS控制各种元素显示的方法,CSS布局页面的技巧等知识。最后一部分为了增强读者的实战能力,以个人博客制作的形式详细为读者演示了使用HTML和CSS制作页面的过程。为了便于理解,本书对所讲解的每个元素和属性,都做了实例演示。

为了方便读者学习,书中光盘提供了丰富的内容,包括全书的多媒体视频演示、全书的电子教案、900多页的电子资料以及书中讲解的源代码等内容。对于每章后面的习题,笔者都给了相应的解答。

本书分为3篇,共20章,从HTML使用的基本内容和概念讲起,循序渐进地讲解了HTML和CSS的相关知识、各种元素和属性的使用方法以及各种技巧等。其中每个部分的主要内容如下所示。

第一篇(第1章~第10章)HTML的相关概念。

详细讲述了HTML的各种概念和相关内容。首先介绍了HTML的基础知识,接着详细讲解了HTML的页面基本元素、文本和段落元素、列表元素、图像元素、表格元素、超链接元素、表单元素、框架元素等知识。

第二篇(第11章~第19章)CSS的相关概念。

首先讲述了CSS布局中的各种概念和相关内容。其中包括CSS的概念、结构和表现分离的原理和优点、XHTML的基础知识、CSS的基本语法和使用方式等。接着讲述了CSS盒模型和块元素的定位。包括CSS中盒模型的构成,块元素与内联元素的分类,以及使用各种属性控制块元素的位置和显示方式等。最后讲述了CSS控制元素显示效果和布局页面的方法。

第三篇(第20章)实战篇。

讲解了实际开发中,使用HTML和CSS代码的技巧。其中包括实际站点的建立、站点结构的规划、页面实例每个部分的制作过程等几个内容。通过本章的学习,可以最终运用可视化的开发软件,结合本书中讲解的各种知识,完整地掌握页面制作的方法。