a我考网

 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,访问微社区

查看: 183|回复: 1

[Dreamweaver] 职称计算机辅导:掌握CSS层叠样式表

[复制链接]
发表于 2012-8-2 09:54:20 | 显示全部楼层 |阅读模式
学习Dreamweaver8了解掌握CSS层叠样式表$ N, W9 H% I/ H0 S5 r- y
了解层叠样式表/ i: n! i" {8 w( {% G
层叠样式表 (CSS) 是一系列格式设置规则,它们控制 Web 页面内容的外观。使用 CSS 设置页面格式时,请将内容与表现形式分开。页面内容(即 HTML 代码)驻留在 HTML 文件自身中,而用于定义代码表现形式的 CSS 规则驻留在另一个文件(外部样式表)或 HTML 文档的另一部分(通常为文件头部分)中。使用 CSS 可以非常灵活并更好地控制具体的页面外观,从精确的布局定位到特定的字体和样式。
+ k" r- S9 x8 P: ~2 {2 C, i; O9 i' RCSS 允许您控制 HTML 无法独自控制的许多属性。例如,可以为选定的文本指定不同的字体大小和单位(像素、磅值等)。通过使用 CSS 以像素为单位设置字体大小,还可以确保在多个浏览器中以更一致的方式处理页面布局和外观。
8 ?) F0 s, }& a& d0 \2 {5 k# {9 \除设置文本格式外,还可以使用 CSS 控制 Web 页面中块级别元素的格式和定位。例如,可以设置块级元素的边距和边框、其他文本周围的浮动文本等。) [7 a; k, h* m8 Q5 }: Y( U: Q* U
CSS 格式设置规则由两部分组成:选择器和声明。选择器是标识格式元素的术语(如 P、H1、类名或 ID),声明用于定义元素样式。在下面的示例中,H1 是选择器,介于括号 ({}) 之间的所有内容都是声明:
' h5 n$ z8 {6 c3 z+ t- m6 ^. D5 @H1 {$ t7 ]" {& G7 P/ P+ `2 {6 }; T
font-size:16 pixels;/ T- Z/ O$ {" l( U- V
! d# \7 f& m# D% K6 f
font-weight:bold;: M8 E( }5 V" M, e! [
}/ a; y8 R, S3 z  ~" B& {# u7 V
声明由两部分组成:属性(如 font-family)和值(如 Helvetica)。上面的 CSS 规则为 H1 标签创建了一个特定的样式:链接到此样式的所有 H1 标签的文本都将是 16 个像素大小、Helvetica 字体和粗体。
/ `# m4 d& A& g6 p4 h术语 cascading 表示向同一个元素应用多种样式的能力。例如,可以创建一个 CSS 规则来应用颜色,创建另一个 CSS 规则来应用边距,然后将两者应用于页面上的同一个文本。所定义的样式向下"层叠"到您的 Web 页面上的元素,并最终创建您想要的设计。
# M/ m; }8 `6 I0 ^  S- c6 E7 g7 p6 ?0 x
CSS 的主要优点是它提供了便利的更新功能;更新一处的 CSS 规则时,使用该已定义样式的所有文档的格式都会自动更新为新样式。
回复

使用道具 举报

 楼主| 发表于 2012-8-2 09:54:21 | 显示全部楼层

职称计算机辅导:掌握CSS层叠样式表

</p>在 Dreamweaver 中可以定义以下样式类型:8 b; c6 g, v: Z+ Y
自定义 CSS 规则(也称为类样式)使您可以将样式属性应用于任何文本范围或文本块。(请参见应用类样式。)$ W: G6 a) F' j( v: x4 s; w& \
HTML 标签样式重定义特定标签(如 h1)的格式。创建或更改 h1 标签的 CSS 样式时,所有用 h1 标签设置了格式的文本都会立即更新。& T* p  `: s5 ~/ p: b% f5 I
CSS 选择器样式(高级样式)重新定义特定元素组合的格式设置,或重新定义 CSS 允许的其他选择器表单的格式设置(例如,每当 h2 标题出现在表格单元格内时都应用选择器 td h2)。高级样式还可以重新定义包含特定 id 属性的标签的格式设置(例如,#myStyle 定义的样式可应用于包含属性值对 id="myStyle" 的所有标签)。! O- q8 f# n3 R6 m- h0 s. D
CSS 规则可以位于以下位置:
& U5 q0 ~8 ~6 |8 E% f6 l外部 CSS 样式表是一系列存储在一个单独的外部 CSS (.css) 文件(并非 HTML 文件)中的 CSS 规则。利用文档文件头部分中的链接,该文件被链接到 Web 站点中的一个或多个页面。, ^1 L) K/ q) B( ]# ?) `, n
内部(或嵌入式)CSS 样式表是一系列包含在 HTML 文档文件头部分的 style 标签内的 CSS 规则。  Q* g  |' S" Z; o* v. h1 {) N6 e6 s7 E
内联样式是在标签的特定实例中在整个 HTML 文档内定义的。. W$ Y! y/ a3 b/ @9 g
Dreamweaver 识别现有文档中定义的样式,只要这些样式符合 CSS 样式准则。' }/ t2 g' N. K8 I) y
提示
3 E1 [+ D% W/ g8 S& O, `# J" E若要显示 Dreamweaver 中包含的 O'Reilly CSS 参考指南,请选择"帮助">"参考",然后从"参考"面板的弹出式菜单中选择"O'Reilly CSS 参考"。
, [1 P( d! Q# O+ ^手动设置的 HTML 格式设置会覆盖通过 CSS 应用的格式设置。要使 CSS 规则能够控制段落格式,必须删除所有手动设置的 HTML 格式。: o6 H' i4 A: G7 ]) C
Dreamweaver 会呈现您在"文档"窗口中直接应用的大多数样式属性。您也可以在浏览器窗口中预览文档以查看样式的应用情况。有些 CSS 样式属性在 Microsoft Internet Explorer、Netscape Navigator、Opera 和 Apple Safari 中呈现的外观不相同,有些目前不受任何浏览器支持。
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|Woexam.Com ( 湘ICP备18023104号 )

GMT+8, 2024-5-5 19:27 , Processed in 0.213486 second(s), 23 queries .

Powered by Discuz! X3.4 Licensed

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表