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”的高度，一般为字体尺寸的一半。
- 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规则定义”对话框中选择“扩展”类别。
[之前]：在样式所控制的对象之前强行分页。
[之后]：在样式所控制的对象之后强行分页。
[光标]：当指针位于样式所控制的对象上改变指针图像。
[滤镜]：对样式所控制的对象应用特殊效果（包括模糊和反转）。