dreamweavercs5css规则面板中英对照及详解
CSS属性 汉英对照表
常用的CSS标签标记属性翻译注释1、字体属性(type)font-family(使用什么字体)font-style(字体的样式，是否斜体)：normal/italic/obliquefont-variant(字体大小写)：normal/small-capsfont-weight(字体的粗细)：normal/bold/bolder/lithterfont-size(字体的大小)：absolute-size/relative-size/length/percentage2、颜色和背景属性(backgroud)color(定义前景色，例如：p{color:red})background-color(定义背景色)background-image(定义背景图片)background-repeat(背景图案重复方式)：repeat-x/repeat-y/no-repeatbackground-attachment(设置滚动)：scroll(滚动)/fixe(固定的)background-position(背景图案的初始位置)：percentage/length/top/left/right/bottom3、文本属性：(block)定义间距：word-spacing(单词之间的距离)letter-spacing(字母之间的距离)text-decoration(定义文字的装饰)：nore/underline/overline/line-through/blinkvertical-align(元素在垂直方向的位置)：baseline(基线)/sub/super/top/text-top/middle/bottom/text-bottomtext-transform(使文本转换为其它方式)：capitalize(大写)/uppercase(首字母大写)/lowercase(小写)/nonetext-align(文字的对齐)：left/right/center/justifytext-indent(文本的首行缩进)length/percentageline-height(文本的行高):normal/numbet/lenggth/percentage(百分比)定义超链接：a：link {color:green;text-decoration:nore}(未访问过的状态)a：visited {color:ren;text-decoration:underline;16pt}(访问过的状态)a:hover {color:blue;text-decoration:underline;16pt}(鼠标激活的状态)4、块属性(block)边距属性：margin-top(设置顶边距)margin-right(设置右边距)margin-bottom(设置底边距)margin-left(设置左边距)填充距属性：padding-top设置顶端真充距)padding-right设置顶端真充距)padding-bottom设置顶端真充距)padding-left设置顶端真充距)5、边框属性(border)border-top-width(顶端边框宽度)border-right-width(右端边框宽度)border-bottom-width(底端边框宽度)border-left-width(d左边框宽度)border-width(一次定义边框宽度)border-color(设置边框颜色)border-style(设置边框样式)border-top(一次定义顶端各种属性)border-right(一次定义右端各种属性)border-bottom(一次定义底端各种属性)border-left(一次定义左端各种属性)图文混排：width(定义宽度属性)height(定义高度属性)float(文字环绕在一个元素的四周)clear(定义某一边是否有环绕)6、项目符号和编号(list)display(定义是否显示)white-space(怎样处理空白部分)：normal/pre/nowraplist-style-type(在列表前加项目符号)disc(圆点)/circle(圈)/square（方形）/decimal（阿拉伯数字）/lower-roman(小写罗马数字)/upper-roman(大写罗马数字)/lower-alpha(小写英文字母)/upper-alpha(大写英文字母)/norelist-style-tyle(在列表前加图案):<url>/nonelist-style-position(决定列表项中第二行的起邕位置)list-style(一次性定义所有属性)7、定位（positioning）即层属性Type：设定对象的定位方式。
Dreamweaver_CS5自学教程-第十课：CSS样式表 2
第十课：CSS样式表10-1 认识CSS (1) 10-2 认识CSS (2)如果说目前在Web设计和开发技术领域，什么是非常“火”的新技术，CSS/DIV页面的布局无疑是其中之一CSS（Cascading Style Sheet），中文译为层叠样式表，是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。
对于一个网页设计者来说，HTML语言一定不会感到陌生，因为它是所有网页制作的基础。
但是如果希望网页能够美观、大方，并且升级方便，维护轻松，那么仅仅HTML是不够的，CSS在这中间扮演着重要的角色。
本课从CSS的基本概念出发，介绍CSS语言的特点，以及如何在网页中引入CSS，并对CSS进行初步的体验。
（其实我们在前面的课程中已经接触到）作用：例子演示。
从CSS对标记的控制入手，讲解CSS的初步知识以及编辑方法。
希望大家能够掌握下一面几个方面的内容：①、标记的概念②、传统HTML的缺点③、CSS的引入1、传统HTML标记，在批量编辑时效率低，不够标准利用CSS样式编辑网页，可以大大挺高效率，规范网页的设计标准。
2、CSS样式代码在网页代码中的位置CSS代码style type="text/css"><!--body,td,th {font-size: 12px;color: #FF0000;}--></style>特点：1）灵活控制网页中的每个元素的样式2）把内容和格式处理相分离，提高工作效率3、CSS样式的链接10-3 编辑CSS样式(1) 10-4 编辑CSS样式(2) 如何编辑CSS样式█1) 属性面板快捷操作1、在下方的属性面板对选中的目标建立CSS规则创建的CSS规则将会应用到所有同类目标上2、建立的CSS规则代码自动添加在网页代码＜head＞部分中3、对建立的CSS样式修改：把鼠标光标在设计页面中放置到需要修改的内容上边，在下方的属性面板中修改，即可对所有应用了此CSS规则的目标修改█2）使用CSS样式面板打开“CSS样式”面板：全部﹤style﹥中显示的是当前网页中的所有CSS样式P表示CSS样式应用的标签的类型，下方显示的是当前CSS样式设置的属性下方修改当前CSS样式的属性修改CSS样式后将会全部应用到同类标签1、利用CSS样式给图片添加边框：选中图片，在CSS样式面板中点击“新建规则”设置“新建CSS规则”的应用属性设置成功，全部﹤style﹥中显示刚刚设置的“img”的属性2、属性的显示方式从下方的按钮中设置█3）手工输入代码10-5 CSS选择器选择器（selector）是CSS中很重要的概念，所有HTML语言中的标记都是通过不同的CSS选择器进行控制的。
第5章 网页制作软件 Dreamweaver CS5(实验教程)
5.2 Dreamweaver CS5站点管理
5.2.3 站点的发布（Windows 7旗舰版平台 ）
1. 安装Internet信息服务
单击“开始”菜单 “控制面板”命令，在窗体中选择“卸载程 2. Web服务器设置 序”，再单击窗体左侧“打开或关闭Windows功能”。 在弹出的“Windows 功能”对话框中，若“Internet信息服务”复 单击“开始”菜单 |“控制面板”命令，在窗体中选择“系统和安 3. IE浏览 选框已勾选，说明本机已安装该组件，否则选中此复选框，单击 全”，再单击窗体右侧“管理工具”，然后启动“ Internet信息服务 启动本机（ Web服务器）IE浏览器，在地址栏输入本机IP地址或 “确定”按钮，等待安装完成。 (IIS) 管理器”应用程序 localhost，进入网站的首页“index.html”
微视频5-2 演示
5.3 网页制作基本操作
5.3.2 网页的文字处理
3. 设置滚动字幕
滚动字幕是用来显示滚动文本的，如网站的最新通知等。字幕 可以水平滚动，也可以上下滚动。 在Dreamweaver CS5中利用<marquee>标签插入字幕 。
选中要做字幕的 文本 ，单击菜单 栏“插入”|“标 签”命令，打开 “标签选择器” 对话框
• 网站与网页的创建与管理
• 网页制作的基本操作
• CSS样式表的创建与使用 • 网页的各种布局方式 • 行为的应用
5.1 Dreamweaver CS5概述
5.1.1 Dreamweaver的发展
Dreamweaver 1.0 Dreamweaver CS3
Dreamweaver 2.0
Dreamweaver 2.01 Dreamweaver 3 Macromedia Dreamweaver 4 时代 Dreamweaver 5 Dreamweaver MX Dreamweaver MX 2004 Dreamweaver 8.0 Adobe 时代
DWCS5属性的英文翻译[资料]
![DWCS5属性的英文翻译[资料]](https://img.taocdn.com/s3/m/8c9693e8900ef12d2af90242a8956bec0975a57a.png)
1、(盒子)布局排版类loat - 浮动：设置块元素的浮动效果。
可选常用到参数left、right ；width - 宽：确定盒子本身的宽度，可以使盒子的宽度不依靠它所包含的内容多少。
height - 高：确定盒子本身的高度；clear - 清除：用于清除设置的浮动效果，常用参数both 、left、right；margin- 边距：控制围绕边框的边距大小。
其中包含4个属性：margin-top控制上边距的宽度、margin-right控制右边距的宽度、margin-bottom控制下边距的宽度、margin-left控制左边距的宽度。
padding-内边界：确定围绕块元素的空格填充数量，其中包含4个属性“padding-top控制上留白的宽度、padding-right控制右留白的宽度、padding-bottom控制下留白宽度、padding-left 控制左留白的宽度。
2、边框border-width -宽：控制边框的宽度，其中分为4个属性：border-top-width顶边框的宽度、border-right-width右边框的宽度、border-bottom-width底边框的宽度、border-left-width左边框的宽度。
border-color -颜色：设置各边框的颜色。
若要使边框的四边显示不同的颜色，可在设置中分别列出。
如，p{: #ff0000 #009900 #0000ff #55cc00}浏览器将四种颜色依次理解为：上边框、右边框、底边框和左边框（自上开始顺时针）。
border-style -样式：设定边框的样式，共有无（none）、虚线（dotted）、点划线线（dotted）、点划线（dashed）、实线（solid）、双线（double）、槽状（grove）、脊状（ridge）、凹陷（inset）和凸起（outset）等9种。
3、CSS文字属性font-family- 字体：设定时，需考虑浏览器中有无该字体。
dreamweaver用法 dreamweaver中css规则详解
Dreamweaver用法——Dreamweaver中CSS规则详解1. 引言Adobe Dreamweaver是一款功能强大的网页设计和开发工具，是许多专业网页设计师和开发者的首选。
本文将详细介绍在Dreamweaver中使用CSS规则的方法和技巧，帮助您更好地利用Dreamweaver进行网站设计和开发。
2. Dreamweaver中CSS规则的基本概念在Dreamweaver中，CSS规则是用来控制网页样式和布局的指令集。
CSS规则由选择器和声明块组成，选择器用于选择要应用样式的HTML元素，声明块则包含了一系列属性和属性值，用于定义所选元素的样式。
Dreamweaver提供了全面的CSS规则编辑和管理功能，可以方便地创建和修改CSS规则，并实时预览样式效果。
3. 创建CSS规则在Dreamweaver中创建CSS规则非常简单。
首先，打开Dreamweaver并打开您想要编辑的HTML文件。
接下来，点击页面底部的“CSS规则”面板（或使用快捷键Ctrl+Alt+2），然后点击“新样式”按钮。
在弹出的对话框中，您可以选择要应用样式的选择器类型（如标签名、类名、ID等），并为选择器命名。
然后，您可以选择要应用的样式属性和属性值，并对这些样式进行设置。
最后，单击“应用”按钮，您的新CSS规则就创建好了。
4. 编辑和管理CSS规则Dreamweaver提供了方便的CSS规则编辑和管理功能，帮助您快速修改和管理页面的样式。
通过单击“CSS规则”面板中的规则名称，您可以直接编辑CSS规则中的属性和属性值。
另外，您还可以使用右键菜单来复制、删除和重新排序CSS规则。
另外，Dreamweaver还提供了CSS样式表的导入和导出功能，方便您在多个项目中复用样式。
5. Dreamweaver中的CSS选择器在Dreamweaver中，CSS选择器用于选择要应用样式的HTML元素。
常见的CSS选择器包括：•标签选择器：选择指定标签名的元素，例如p选择所有<p>元素。
DW中CSS属性详解
DW中CSS属性详解ver的CSS样式里包含了W3C规范定义的所有CSS1的属性，Dreamweaver把这些属性分为Type（类ckground（背景）、Block（块）、Box（盒子）、Border（边框）、 List （列表）、Positioning、Extensions（扩展）八个部分，如下图，下面我们分别详细讲解。
Type（类型）板主要是对文字的字体，大小，颜色，效果等基本样式进行设置。
设置时，我们只对要改变的属性，没有必要改变的属性就空着。
性名带*号的是指样式效果不能在编辑文档时显示，要用浏览器打开才能看到效果。
置字体系列。
什么叫字体系列呢？是指对文字设定几个字体，当遇到第一个字体不能显示的文字用系列中的第二个字体或后面的字体显示。
相对应的CSS属性是”font-family”。
eamweaver4已经内置设定了6个系列的英文字体，一般英文字体我们用“Verdana, Arial, a, sans-serif”这个系列比较好看。
如果不用这些字体系列，你就需要自己编辑字体系列，你可拉框最下面的“Edit Font List”来创建新的字体系列，也可以直接手动在下拉框里写字体名，用逗号隔开。
中文网页默认字体是宋体，一般就空着不要选取任何字体。
义文字的大小。
你可以通过选取数字和度量单位来选择具体的字体大小，或者你也可以选择一个体大小。
最好使用Pixels作为单位，这样不会在浏览器中文本变形。
一般小字体用比较标准的对应的CSS属性是”font-size”。
S中长度的单位分绝对长度单位和相对长度单位，一般我们常用的绝对长度单位有：素）根据显示器的分辨率来确定长度。
号）根据windows系统定义的字号大小来确定长度。
in：（毫米、厘米、英寸）根据显示的实际尺寸来确定长度。
此类单位不随显示器的分辨率改变单位有：文本的尺寸。
例如：{ font-size:2em}是指文字大小为原来的2倍。
字母“x”的高度，一般为字体尺寸的一半。
css中文对照手册
边框：border-style none ：无轮廓。
border-color 与border-width 将被忽略,hidden ：隐藏边框。
dotted ：点状轮廓。
dashed ：虚线轮廓。
solid ：实线轮廓double ：双线轮廓。
两条单线与其间隔的和等于指定的border-width 值,groove ：3D 凹槽轮廓。
ridge ：3D 凸槽,轮廓。
inset ：3D 凹边轮廓。
outset ：3D 凸边轮廓。
border-radius ： 设置对象使用圆角边框 <length>：用长度值设置对象的圆角半径长度。
不允许负值 <percentage>：用百分比设置对象的圆角半径长度。
不允许负值 这两个对象一般为10px ；border-top-right-radiu s设置对象右上角圆角边框 border-top-left-radius 设置对象左上角圆角边框 border-bottom-left-rad ius设置对象左下角圆角边框border-bottom-right-ra dius 设置对象右下角圆角边框背景：属性 简介background 复合属性。
设置对象的背景特性 background-color 设置对象的背景颜色background-image设置对象的背景图像none ：无背景图。
<url>：使用绝对或相对地址指定背景图像。
background-repeat 设置对象的背景图像如何铺排填充repeat-x ：背景图像在横向上平铺 repeat-y ：背景图像在纵向上平铺 repeat ：背景图像在横向和纵向平铺 no-repeat ：背景图像不平铺 round ：背景图像自动缩放直到适应且填充满整个容器。
（CSS3）space ：背景图像以相同的间距平铺且填充满整个容器或某个方向。
（CSS3）background-attachment 设置对象的背景图像是随对象内容滚动还是固定的fixed ：背景图像相对于窗体固定。
DW中CSS属性详解
ver的CSS样式里包含了W3C规范定义的所有CSS1的属性，Dreamweaver把这些属性分为Type（类ckground（背景）、Block（块）、Box（盒子）、Border（边框）、 List（列表）、Positioning 、Extensions（扩展）八个部分，如下图，下面我们分别详细讲解。
Type（类型）板主要是对文字的字体，大小，颜色，效果等基本样式进行设置。
设置时，我们只对要改变的属性，没有必要改变的属性就空着。
性名带*号的是指样式效果不能在编辑文档时显示，要用浏览器打开才能看到效果。
置字体系列。
什么叫字体系列呢？是指对文字设定几个字体，当遇到第一个字体不能显示的文字用系列中的第二个字体或后面的字体显示。
相对应的CSS属性是”font-family”。
eamweaver4已经内置设定了6个系列的英文字体，一般英文字体我们用“Verdana, Arial,a, sans-serif”这个系列比较好看。
如果不用这些字体系列，你就需要自己编辑字体系列，你可拉框最下面的“Edit Font List”来创建新的字体系列，也可以直接手动在下拉框里写字体名，用逗号隔开。
中文网页默认字体是宋体，一般就空着不要选取任何字体。
义文字的大小。
你可以通过选取数字和度量单位来选择具体的字体大小，或者你也可以选择一个体大小。
最好使用Pixels作为单位，这样不会在浏览器中文本变形。
一般小字体用比较标准的对应的CSS属性是”font-size”。
S中长度的单位分绝对长度单位和相对长度单位，一般我们常用的绝对长度单位有：素）根据显示器的分辨率来确定长度。
号）根据windows系统定义的字号大小来确定长度。
in：（毫米、厘米、英寸）根据显示的实际尺寸来确定长度。
此类单位不随显示器的分辨率改变单位有：文本的尺寸。
例如：{ font-size:2em}是指文字大小为原来的2倍。
字母“x”的高度，一般为字体尺寸的一半。
12.4.1 固定宽度且居中的版式_Dreamweaver CS5中文版完全自学手册_[共2页]
![12.4.1 固定宽度且居中的版式_Dreamweaver CS5中文版完全自学手册_[共2页]](https://img.taocdn.com/s3/m/583c5bc9c5da50e2534d7f44.png)
面
12
C S S + DIV
本节视频教学录像：14 分钟 CSS 排版是一种很新的排版理念，完全有别于传统的排版习惯。它将页面首先在整体 上进行<div>标记的分块，然后对各个块进行 CSS 定位，最后再往各个块中添加相应的内容。 通过 CSS 排版的页面，更新起来十分容易，只需修改 CSS 的属性来重新定位即可。下面介 绍 CSS 排版的整体思路。
clear:both;
代码如下。
#links{ float:right; width:200px; border:1px solid#000000; margin-left:-200px 拉回 200px*/
text-align:center; height:30px; border:1px solid#000000; }
12.4.1 固定宽度且居中的版式
宽度固定而且居中的版式是网络中最常见的排版方式之一，本小节利用 CSS 排版的方 式制作这种通用的结构。
首先将所有的页面内容用一个大的<div>包裹起来，如下所示。
<html> <head>固定宽度且居中的版式</head>
193
这样页面的整体框架便搭建好了。这里 第 /*往左 需要指出的是：#content 块中不能放宽度太
宽的元素，否则#links 将再次被挤到#content 章
text-align:center;
的nt 的内容与#links 的
内容发生了重叠，这时只需要设置#content
在对页面采用 CSS 布局时，通常都
的 padding-right 为-200px，在宽度不变的情
需要绘制页面的框架图，至少要做到心中
dw css翻译
dw css翻译CSS（CascadingStyleSheets），中文翻译为层叠样式表，是一种样式表语言，用来描述网页的布局、样式和结构，它能够使网页的外观与内容分离，使 HTML结构与表现形式分离，从而使网页变得更加美观大方。
CSS web发中最重要的技术之一，它被用于定义网页的排版、样式和布局，是 web计的基础技术，也是一种可以定制 HTML素的标记语言，它可以定义 HTML 中的每个元素如何显示，比如，它可以定义文本的颜色、大小、字体等等。
CSS结构特别简单，支持以多种方式定义样式，并且可以将这些样式应用到 HTML件中的任何元素上。
例如，在网页中，CSS以用来设置文本颜色，定义元素的尺寸、形状和边距，以及设置背景图片等等。
此外，CSS支持其他一些特性，比如 box model（盒子模型），它使我们可以调整和控制 HTML素的宽度、高度、边框等，协助我们定义元素在页面中的大小和位置。
而且，CSS可以用来定义如何显示 HTML素，例如，它可以用来定义页面文字的大小、颜色、样式，以及控制页面中元素的排版，以及定义图片在文本中的位置等等。
此外，CSS支持两种选择器，ID class，它们允许用户通过标记HTML素来定义它们的样式。
通过将 ID class予单个 HTML素，可以轻松定义这个元素的样式，而不会影响到其他的 HTML素。
CSS支持非替换样式表（Non-replacing Style Sheets），这种样式可用于将不同的 HTML素放在一起，以便进行更复杂的设计。
CSS一种极其有用的技术，它有许多优点，包括：-能够让用户更快地完成网站设计，而且可以保障网站的一致性和统一性；-可以精确定义 HTML素的样式，从而使得网站的设计更加精致； -使得在团队开发网站时，设计师可以更轻松地与程序员共同开发网站；-可以帮助用户更轻松地管理网站的样式，而不必手动调整每个文件。
总之，CSS一种令人惊叹的技术，它使网页设计变得更加简单、便捷，而且还能够提供美观大方的网站外观。
网页设计与制作——Dreamweaver CS5标准教程第11章 CSS样式
11.1 CSS样式
11.1.2 CSS样式构造规则
CSS样式是由三个要素对象、属性和属性值构成的。 对象是CSS样式所作用和控制的网页元素，属性是 CSS样式描述和设置对象性质的项目，属性值是属性 的一个实例。
Body { font-family：宋体； font-size：15px； color：red； text-decoration：underline； } 页面文字 { 字体：宋体； 大小：15像素； 颜色：红色； 装饰：下划线 }
11.1 CSS样式
11.1.3 CSS样式种类
根据CSS样式所控制的网页元素不同，可以将样式分 为4种形式。 当所控制的网页元素是HTML语言中的某一个特定的 标签时，为此标签设置的CSS样式，称为标签样式。 当把网页中或网站中若干元素归为一类，作为一个整 体来看待，为此类元素设置一个CSS样式，称为类样 式。
111css样式?一个标签或元素在网站中的不同网页中或在一个网页中的不同位置上外观效果不同则需要先为该特定标签赋予一个唯一的id号然后再为具有该id号的标签设置样式称此样式为id样式
第11章 CSS样式
网页设计与制作 Dreamweaver CS5 标准教程
本章学习的主要内容：
1. CSS样式构造规则及意义 2. 利用CSS样式面板创建各种样式 3. 利用CSS样式面板创建文本导航条 4. 利用CSS样式面板创建CSS滤镜
11.2 CSS样式控制面板
11.2.3 CSS样式的存储位置
1. 定义内部样式 2. 移动CSS规则 3. 定义外部样式 4. 附加样式表
11.2.4编辑样式
11.3 CSS属性
常用的CSS属性的英文单词总结及用法、解释
2、边框
border-width -宽 ：控制边框的宽度，其中分为4个属性：border-top-width顶边框的宽度、border-right-width右边框的宽度、border-bottom-width底边框的宽度、border-left-width左边框的宽度。
blue 蓝色 bug 软件程序中的错误
body 主体，一个HTML 标记 building 建立
bold 粗体 button 按钮
anchor 锚记<a>标记是这个单词的缩写 anchor 锚记<a>标记是这个单词的缩写
arrow 箭头 arrow 箭头
auto 自动 auto 自动
text-align - 文本对齐：设置块的水平对齐方式。共有左对齐（left）、右对齐（right）、居中（center）和均分（justify）等4种选择。
text-indent - 文字缩进：控制块的缩进程度。
white-space -空白间距：在HTML中，空格是被省略的；在CSS中则使用属性（white-space）控制空格的输入。共有正常（normal）、保留（pre）和不换行（nowrap）等3种选择。
B
background 背景 border 边框
banner 页面上的一个横条 both 二者都是clear 属性的一个属性值
background-attachment - 附加：用于控制背景图像是否会随页面的滚动而一起滚动。有固定（fixd，文字滚动时，背景图像保质固定）和滚动（scroll，背景图像随文字内容一起滚动）两种选择。
DW-CS5-CSS规则英汉对照表
一、类型Font-family:字体Font-size:字体大小Font-style:字体风格，如斜体、正常等Line-height:行高（用来设定字行间距）Font-weight:字体浓淡Font-variant:字体变量（用来设定字体是正常显示，还是以小型大写字母显示）Text-transform:文本转换（用来设定字体的大小写转换）Text-decoration（字体装饰）:underline下划线Overline上划线line-through线-穿过blink闪光none 无二、背景Background-color:背景颜色Background-image:背景图片Background-repeat:背景重复Background-attachment:背景附着（用来设定背景图片是否随文档滚动）Background-position:背景位置XBackground-position:背景位置Y三、区块Word-spacing:词间距Letter-spacing:字符间距Vertical-align:垂直对齐Text-align:水平对齐Text-indent:文本缩进White-space:空白Display:显示四、方块Width:宽度Height:高度Float:浮动Clear:规定元素的哪一侧不允许出现其他浮动元素Padding间隙（用来填充一些空白，参考如下图）:Top 上Right 右Bottom 下Left 左Margin：边距（用来设定边距的宽度）五、边框Style:样式（如：虚线等）Width:宽度Color:颜色六、列表List-style-type:列表样式类型（用来设定列表项标记（list-item marker）的类型）List-style-image:列表列表样式图片（用来设定列表样式图片标记的地址）List-style-Position:列表样式位置（用来设定列表样式标记的位置）七、定位Position:位置Width:宽度Height:高度Visibility:规定元素是否可见（即使不可见，但仍占用空间，建议使用display来创建不占页面空间的元素）Z-index:设置元素的堆叠顺序（该属性设置一个定位元素沿Z轴定义为垂直延伸到显示区的轴，如果为正数，则离用户更近，为负数则表示离用户更远）Overflow:规定当内容溢出元素框时发生的事情Placement:放置Clip：裁剪绝对定位元素八、扩展Page-break-before:属性设置元素前Page-breaking行为Page-break-after:属性设置元素后Page-breaking行为Cursor：规定要显示的光标的类型（鼠标放在指定位置鼠标的形状）Filter:过滤友情提醒：尽量少的使用分页属性，并且在表格、浮动元素、带有边框的元素中使用分页属性。
css样式中英文对照表
一、类型font—family字体font-size字体大小font—style 字体样式(斜体/偏斜体）line-height行高text- decoration下划线/上划线font—weight字体粗细font—variant变体text-transform大小写color字体颜色二、背景background-color背景颜色background-image背景图片background-repeat背景重复方式background-attachment背景滚动或固定background-position背景水平位置三、区块word-spacing单词间距letter—spacing字幕间距vertical—align垂直对齐方式text—align文本对齐方式text—indent文本缩进方式white-space保密方式display保留方式四、方框Width宽Height高Float浮动方式Clear清除方式Padding填充/内边距Top上边Right右边Bottom下边Left左边Margin边框/外边框五、边框/Border Style 样式 /width 宽度/ color 颜色六、列表list-style—type列表标记符号类型list-style-image列表项目符号图象list—style-position列表位置七、定位Position位置Visibility显示/规定元素是否可见z—index：z轴/设置元素的堆叠顺序Overflow谊位/规定内容溢出元素发生的事情Placement放置Top上置入Right右置入Bottom下置入Left左置入Clip裁剪绝对定位元素Top上Right右Bottom下Left左八、扩展分页Page-break-before扩展之前视觉效果Page-break-after扩展之后视觉效果Cursor光标Filter过滤器（滤镜)。
初识Dreamweaver CS5
4.3 CSS在Dreamweaver中的运用
图4-40 box_1容器的盒模型
图4-41 box_2容器的盒模型
Box_1宽 =40px+30px+20px+100px+20px+30px+40px=280px
Box_1高 =30px+30px+30px+100px+20px+30px+40px=280px
外部样式是目前在实际工作中使用最为广泛 的一种形式。它将CSS样式代码保存为一个样式 文件，然后在页面中使用<link>标签链接到这 个样式文件，以便实现多个页面调用同一个外 部样式文件的目的。该类型样式使用<link>标 签，放置在<head>与</head>之间。
在站点内创建空白HTML文档。 执行“文件”的“新建”命令，在“页面类型”里
4.1 初识Dreamweaver CS5
“插入”面板：包含将各种网页元素（如图像、
超链接、多媒体和表格等）插入到网页文档的快捷按 钮。这些按钮被分类组织到各个选项卡中。
显示“插入”面板：选择“窗口”→“插入”
命令
4.1 初识Dreamweaver CS5
“CSS样式”面板：主要跟踪当前页面元素的
通配符选择符用“*”号进行表示，其作用是定义页 面所有元素的样式，而类型选择符指的是那些使用网页 已有标签类型作为名称的选择符，如body、p和h1等 。
如单击状态栏的<body>标签，则选定文档中整个正文。
② 选取工具 用于启动和禁用手形工具。 ③ 手形工具 用于在文档窗口中单击并拖动文档。
4.1 初识Dreamweaver CS5
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
定义文本样式、保存CSS规则后系统将行动打开“CSS规则定义”对话框。
[字体]：选择所需要的字体。
[大小]：定义字体大小。
[样式]：可选择字体的特殊样式，即“正常”、“斜体”或“偏斜体”等。
[行高]：设置文本所在行的高度。
也可以输入一个确切的值并选择一种度量单位。
[修饰]：在文本中添加下划线、上划线或删除线，或者使文本闪烁。
[粗细]：字体应用特定或相对的粗体量。
[变体]：设置文本的变体方式。
[大小写]：将所选内容中每个单词的首字母大写，或者将文本设置为全部大写或小写。
[颜色]：设置文本颜色。
要定义背景样式可在“CSS规则定义”对话框中选择“背景”选项。
[背景颜色]：设置背景颜色。
[背景图像]：设置背景图像。
[重复]：确定是否以及如何重复背景图像。
（不重复）：只在元素开始处显示一次图像。
（重复）：在元素的后面水平和垂直平铺图像。
（横向重复）和（纵向重复）：分别显示图像的水平带区和垂直带区。
图像将被剪辑以适合元素的边界。
[附件]：确定背景图像是固定在原始位置还是随内容一起滚动。
[水平位置]和[垂直位置]：指定背景图像相对于元素的初始位置。
这可以用于将背景图像与页面中心垂直和水平对齐。
如果附件属性为“固定”，位置则相对于“文档”窗口而不是元素。
3.区块样式的定义
使用“CSS规则定义”对话框中的“区块”类别可以定义标签和属性的间距、对齐等设置。
[单词间距]：设置单词的间距。
在下拉列表中选择“值”选项，然后输入数值可确定单词的间距，此时可在右侧的弹出式菜单中选择度量单位（例如像素、点等）。
[字母间距]：设置字母或字符间的间距。
负值（例如-4）表示减小字符间距。
字母间距设置可覆盖对齐的文本设置。
[垂直对齐]：指定垂直对齐方式。
[文本对齐]：设置元素中的文本对齐方式。
[文字缩进]：指定第一行文字缩进程度，并可在右侧选择数值单位。
也可以使用负值创建凸出，但显示方式则取决于浏览器。
[空格]：确定如何处理元素中的空白。
（正常）：收缩空白。
（保留）：与文本被括在pre标签中一样（即保留所有空白，包括空格、制表符和回车等）。
（不换行）：指定仅当遇到br标签时文本才换行。
[显示]：指定是否以及如何显示元素。
“无”表示关闭应用此属性的元素的显示
使用“CSS规则定义”对话框中的“方框”类别可以为控制元素在页面上的放置方式的标签和属性定义设置。
可以在应用填充和边距设置应用于元素的各个边，也可以使用“全部相同”设置将相同的设置应用于元素的所有边。
在打开的“CSS规则定义”对话框中选择“方框”类别。
[宽]和[高]：设置元素的宽度和高度。
[浮动]：设置其它他元素（如文本、层、表格等）在哪个边围绕浮动。
其他元素按通常的方式环绕在浮动元素的周围。
[清除]：定义元素的哪一边不允许有层。
如果层出现在被清除的那一边防战士，则（带清除设置）元素移到该层的下方。
[填充]：指定元素内容与元素边框的间距。
[边界]：指定一个元素的边框与另一个元素的间距。
使用“CSS规则定义”对话框中的“边框”类别可以定义元素周围边框的设置。
在“CSS规则定义”对话框中选择“边框”类别。
[样式]：设置边框的样式外观。
[宽度]：设置元素边框的粗细。
[颜色]：设置边框的颜色。
6.列表样式的定义
使用“CSS规则定义”对话框中的“列表”类别可以为列表标签定义列表设置（如项目符号大小和类型等）。
在“CSS规则定义”对话框中选择“列表”类别。
[类型]：设置项目符号或编号的外观。
[项目符号图像]：为项目符号指定自定义图像。
[位置]：设置列表项文本是否换行和缩进（外部），以及文本是否换行到左边距（内部）。
[定位]样式属性使用“层”首选参数中定义层的默认标签，将标签或所选文本块更改为新层。
在“CSS规则定义”对话框中选择“定位”类别。
[类型]：确定浏览器应如何来定位层。
（绝对）：使用“定位”框中输入的坐标相对于页面左上角来放置层。
（相对）：使用“定位”框中的坐标（相对于对象在文档的文本流中的位置）来放置层。
（静态）：将层放在文本流中的位置。
[显示]：确定层的初始显示条件。
可选择以下的可见性选项之一。
（继承）：继承层的父级的可见性属性。
如果层没有父级，它将是可见的。
（可见）：显示这些层的内容。
（隐藏）：隐藏这些层的内容。
[Z轴]：确定层的堆叠顺序。
编号较高的层显示在编号较低的层的上面。
值可以为正也可以为负。
[溢位]：确定当前的内容超出层的大小时的处理方式。
（可见）：增加层的大小，以使其所有的内容都可见。
（隐藏）：保持层的大小并剪辑任何超出的内容。
不提供任何滚动条。
（滚动）：在层中添加滚动条，不论内容是否超出层的大小。
明确提供滚动条可避免滚动条在动态环境中出现和消失所引起的混乱。
（自动）：使滚动条仅在层的内容超出层的边界时才出现。
[置入]：指定层的位置和大小，如果层的内容超出指定的大小，大小值将被覆盖。
[裁切]：定义层的可见部分。
8.扩展样式的定义
“扩展”样式的属性包括“滤镜”、“分页”和“光标”等选项，它们之中的大部分不受任何浏览器的支持，或者仅受Inernet Explorer 4.0和更高版本的支持。
在“CSS规则定义”对话框中选择“扩展”类别。
[之前]：在样式所控制的对象之前强行分页。
[之后]：在样式所控制的对象之后强行分页。
[光标]：当指针位于样式所控制的对象上改变指针图像。
[滤镜]：对样式所控制的对象应用特殊效果（包括模糊和反转）。