注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

火力光波的博客

火一般的热情 光一样的速度

 
 
 

日志

 
 

薛欣DW8入门基础学习笔记(5)  

2010-04-14 18:23:38|  分类: DW8操作 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

薛欣DW 8入门基础学习笔记(5)

教程目录地址:http://www.it.com.cn/f/edu/074/17/406712.htm

第九章 布局模式与层

1、内容提要与学习目标
2、表格扩展模式
布局→标准→表格→设置→确定→扩展→编辑→退出。
3、绘制布局表格
布局→布局→点绘制布局表格→绘制表格→点绘制布局单元格→绘制单元格→退出。
4、绘制布局单元格
布局→布局→点绘制布局单元格按钮,再绘制;按ctrl可连续绘制单元格。
5、绘制嵌套表格
在布局表格中插入光标,再点绘制布局表格,可嵌套表格。
6、移动缩放表格
表格、单元格,移动可改变位置;拖动可改变大小。
7、插入行和列
布局→布局→插入光标→点插入行或列按钮。
8、表格属性与间隔图像
选择布局单元格,在属性面板中可设置布局单元格属性;
选择布局表格,在属性面板中可设置清除行高、使单元格宽度一致、删除所有间隔图像、删除嵌套等;
9、使用网格精确绘制
查看菜单→网格→显示网格。
10、使用层布局
布局→点绘制层或div→按左健绘制。按ctrl健可多次绘制层。
在层中可插入文字、图片,添加连接。
移动层可改变位置,拖动手柄可改变大小。
11、精确调整层
移动1个像素:方向键;     移动10个像素:shift+方向键。
缩放1个像素:ctrl+方向键;缩放10个像素:ctrl+shift+方向键。
12、使用菜单创建层
插入光标→插入菜单→布局对象→层。
13、层的嵌套
去掉层面板中的防止重叠勾选→点绘制层→在层中按左健绘制。
按ctrl+Alt健可多次绘制嵌套层。注意嵌套层与重叠层的区别。
14、层属性
点左上角手柄选择层→在属性面板中设置层编号等属性。
层编号:层的名称。左、上:层的定位。Z轴:层的排序。剪辑:将左右上下剪辑的隐藏掉。
可见性:default可见(默认), inherit继承,visible可见,hidden不可见。
溢出:visible溢出的显示,hidden溢出的隐藏,scroll溢出的有滚动条   auto视情而定。
15、可视化剪辑层技巧
绘制一层→拖入图片→再绘制嵌套层→记住左、上、宽、高数字→删除嵌套层
→选择该层→在剪辑中输入左、上、右=左+宽、下=上+高→回车。
16、使用层面板
层面板有眼睛、名称、Z轴。点击眼睛可显示或隐藏。双击名称、Z轴可修改。
选中某层按删除键能删除层。拖动可排序层,按Ctrl键拖动可嵌套层。
勾选层面板中的防止重叠可与行为配合使用。
17、标尺与辅助线使用技法
①按ctrl+Alt+R切换显示隐藏标尺。按住左上角拖动可改变原点,双击返回。右键菜单可设置。
②通过查看菜单命令可切换、改变原点和编辑。
从标尺的左边或上边可拖出辅助线,拖进为清除辅助线。
18、网格使用技法
通过查看菜单命令可显示、靠近和设置网格。
19、辅助线的精确设置
通过查看菜单命令可编辑、设置辅助线。


第十章 CSS样式

1、学习内容与目标
2、案例介绍
分别打开两个文件tetx1.html、tetx1ok.html。
3、样式面板制作标题样式
①CSS样式→新建CSS规则→选择标签→输入h1→选定仅对该文档→确定→点类型/设置→点区块/设置→确定;
②选中标题1→在属性面板的格式中选择“标题1”。代码如下:
h1 {
 font-family: "黑体";
 font-size: 18px;
 font-weight: bolder;
 color: #FF0000;
 text-align: center;
}
4、对照法制作H2样式
①CSS样式→新建CSS规则→选择标签→输入h2→选定仅对该文档→确定→点类型/设置→点区块/设置→确定;
②选中标题2→在属性面板的格式中选择“标题2”。代码如下:
h2 {
 font-family: "宋体";
 font-size: 12px;
 font-weight: bold;
 color: #000099;
 text-align: center;
}
5、设置段落样式
CSS样式→新建CSS规则→选择标签→输入p→选定仅对该文档→确定→点类型/设置→点区块/设置→点方框/设置→确定。
代码如下:
p {
 font-family: "宋体";
 font-size: 9pt;
 color: #333333;
 text-indent: 18pt;
 margin-right: 50px;
 margin-left: 50px;
}
6、设置图片样式
①文件面板→选择图片→拖入图片;
②CSS样式→新建CSS规则→选择类→输入image1→选定仅对该文档→确定→点方框/设置→确定;
③右击CSS面板中的image1→套用。代码如下:
.image1 {
 float: right;
 height: 200px;
 width: 250px;
 padding-right: 10px;
 padding-left: 20px;
}
7、扶植法制作图片样式
①CSS样式→右击image1→复制→改为image2→选中image2→编辑样式→修改→确定;
②文件面板→选择图片→拖入图片;
③在属性面板选择类中的image2。代码如下:
.image2 {
 float: left;
 height: 200px;
 width: 250px;
 padding-right: 20px;
 padding-left: 10px;
}
8、用代码创建CSS样式
用菜单命令中创建样式:修改菜单→页面属性→在页面属性中设置→确定。如:
<style type="text/css">
<!--
body,td,th {
 font-family: 宋体;
 font-size: 9pt;
 color: #0000FF;
 font-weight:bold;
}
body {
 background-color: #009933;
}
a:link {
 color: #00FF00;
}
a:visited {
 color: #FFFF00;
}
a:hover {
 color: #00FFFF;
}
-->
</style></head>
9、在属性面板创建、修改、切换CSS样式
在属性面板中创建样式:选择对象→在属性面板中设置→回车。
在属性面板中套用样式:先在属性面板中创建一个样式名为STYLE1→选中另一对象→在样式中选择STYLE1(如选择无为取消样式)。
在CSS面板中用右键菜单或双击样式名可修改样式。
10、CSS“全部”模式的使用
窗口→CSS样式→全部:列出当前所使用的所有CSS样式规则,选择、右击、双击某规则可进行编辑。
选择某规则,在下面属性栏中可修改、添加某规则的属性。其中蓝色为已设置的属性。
点显示类别视图,属性栏中的属性按类显示;
点显示列表视图,将属性栏中的属性依次排列显示;
点显示设置属性,在属性栏中的显示已设置的属性;
11、CSS“正在”模式的使用
窗口→CSS样式→正在:列出当前所使用的CSS样式规则,选择、右击、双击内容摘要中的某规则可进行编辑。
选择内容摘要中的某规则,下面的信息栏、属性栏相应改变。其中蓝色为已设置的属性。
信息栏,是供学习参考的。有相关信息和规则层叠两个按钮。
属性栏,是供修改的。
12、附加外部样式表
导入样式表:CSS样式→附加样式表→浏览选择CSS样式文件→确定→选中链接或导入→媒体/所有→确定。
套用样式表:打开一个原始文件→选中标题→在属性的格式中选中标题→选中图片→右击CSS面板图片规则→套用→…。
范例样式表:供你选择使用。
13、CSS样式类的使用
在CSS面板中创建样式:CSS样式→新建CSS规则→选定“类”→输入名称→选定仅对该文档→确定→在规则定义中设置→确定。
“类”:可应用于任何标签,可对多个对象进行设置,是自定义的。
14、CSS样式标签的使用
CSS样式→新建CSS规则→选定“标签”→在标签中选择→选定仅对该文档→确定→在规则定义中设置→确定。
“标签”:定义特定标签的外观,body是针对全局的,共有90种可选择。
15、CSS样式高级的使用
CSS样式→新建CSS规则→选定“高级”→在选择器中输入名称→选定仅对该文档→确定→在规则定义中设置→确定。
“高级”:可设置伪类,设置某个特定的对象。还可设置多个标签,如在选择器中输入body,td,h1三个标签。
16、定义在单独的CSS文件
CSS样式→新建CSS规则→选定“类型”→输入名称→选定“新建样式表文件”→确定→在规则定义中设置→确定。
“新建样式表文件”:将样式定义到一个单独的文件,定义一个新建的CSS文件。
17、修改与删除CSS样式
嵌入CSS样式:打开CSS样式→新建CSS规则→选定“仅对该文档”→确定。
删除CSS样式:打开CSS样式→选择CSS规则→删除CSS规则。
修改CSS样式:打开CSS样式→选择CSS规则→编辑样式。
18、名词解释

 

薛欣DW8入门基础学习笔记(1) (2) (3) (4) (5)

 

薛欣DW8入门基础学习笔记(5) - 火力光波 - 火力光波的博客

  评论这张
 
阅读(1241)| 评论(10)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017