利用APDiv布局页面.ppt
《利用APDiv布局页面.ppt》由会员分享,可在线阅读,更多相关《利用APDiv布局页面.ppt(12页珍藏版)》请在装配图网上搜索。
21世纪职业教育数字艺术规划教材,网页设计与制作技能案例教程,第四章,利用APDiv布局页面,:21世纪职业教育数字艺术规划教材:,学习目标,使学生熟悉APDiv的创建和选择。使学生熟悉APDiv的移动和改变大小。使学生熟悉AP元素面板的使用。,:21世纪职业教育数字艺术规划教材:,本章重点,掌握APDiv的属性设置。掌握APDiv的定位。,:21世纪职业教育数字艺术规划教材:,4.1创建APDiv,1创建普通APDiv一般有以下3种方法:(1)将插入点放置在页面中。选择【插入记录】【布局对象】【APDiv】,插入APDiv。(2)单击“布局”插入栏中的【绘制APDiv】按钮,在文档窗口中通过拖动鼠标即可绘制一个APDiv。(3)单击“布局”插入栏中的【绘制APDiv】按钮,按住【Ctrl】键并拖动鼠标即可连续绘制多个APDiv。,2选择APDiv一般都有一下4种方法。(1)将插入点放置在APDiv中,单击文档窗口左下角标签,即可选择APDiv。(2)在“AP元素”面板中单击APDiv的名称,即可选择APDiv。(3)按住【Shift+Ctrl】组合键并单击APDiv,即可选择APDiv。(4)按住【Shift】键,分别单击要选择的各APDiv的内部或边框线,可以选择多个APDiv。,:21世纪职业教育数字艺术规划教材:,APDiv的属性面板主要选项含义如下:(1)【CSS-P元素】:用来指定APDiv的名称,用于识别不同的APDiv。(2)【左】:用来指定APDiv的左边浏览器窗口左边界的距离。(3)【上】:用来指定APDiv的上边浏览器窗口上边界的距离。(4)【宽】:用来指定APDiv的宽。(5)【高】:用来指定APDiv的高。(6)【Z轴】:用来指定APDiv的Z轴顺序(即堆叠顺序)。,4.2APDiv属性面板,:21世纪职业教育数字艺术规划教材:,(7)【可见性】:用来指定APDiv的显示状态,其中主要选项含义如下。default:表示为默认值。inherit:表示继承其父APDiv的属性。visible:表示APDiv及其内容为可见方式,与父APDiv无关。hidden:表示APDiv及其内容为隐藏方式,与父APDiv无关。(8)【背景图像】:用来指定APDiv的背景图像。单击“浏览文件”按钮,在弹出的“选择图像源文件”对话框中选择图像,或者直接在文本框中输入图像的路径。(9)【背景颜色】:用来指定APDiv的背景颜色。,4.2APDiv属性面板,:21世纪职业教育数字艺术规划教材:,(10)【溢出】:如果APDiv里面的文字太多或图像太大,APDiv的大小不足以全部显示的时候,就需要设置该功能,其中主要选项的含义如下。visible:当APDiv中的内容超出APDiv的范围时,APDiv自动向右,向下扩大以显示APDiv的全部内容。hidden:当APDiv中的内容超出APDiv的范围时,APDiv的大小不变,只显示与APDiv大小相同的内容,其他的内容将不显示。scrool:不论APDiv是否能完全显示的其中内容,都将会在APDiv中显示滚动条。auto:当APDiv中的内容超出APDiv的范围时,APDiv的大小保持不变,但APDiv的左端或下端会出现滚动条,使APDiv中超出范围的内容能够通过拖动滚动条来查看。(11)【剪辑】:用来指定APDiv的哪一部分是可见的,输入的数值是距离APDiv的4个边界的长度。,4.2APDiv属性面板,:21世纪职业教育数字艺术规划教材:,在文档窗口中插入APDIV后,在操作过程中常常会根据需要,对APDIV的属性进行适当的调整,如移动APDIV、改变APDIV的大小和对齐APDIV等操作。,4.3调整APDiv,:21世纪职业教育数字艺术规划教材:,4.3调整APDiv,(1)移动APDIV移动APDIV有以下3种方法:选中APDIV,当光标靠近APDIV的缩放手柄时,鼠标指针就会变成十字箭头形状,按住鼠标左键拖动,APDIV将跟着光标的移动而发生改变。选中APDIV,按键盘上的方向键,一次可以将其移动一个像素。选中APDIV,按住【shift】键,然后按键盘上的方向键,一次可以将其移动10个像素。,:21世纪职业教育数字艺术规划教材:,4.3调整APDiv,(2)改变APDIV大小改变APDIV的大小有以下3种方法:将鼠标指针移动到APDIV边框上的小黑方框上,当它变为垂直双向箭头时,按住鼠标左键向下或向上拖动鼠标,则可以调整APDIV的高度;当鼠标指针变为水平双向箭头时,按住鼠标左键向左或向右拖动鼠标,则可以调整APDIV的宽度。当鼠标指针变为斜向双箭头时,按住鼠标左键斜上或斜下拖动鼠标,则可以调整APDIV的高度或宽度。在【属性】面板中输入宽度和高度值来改变APDIV的大小。,:21世纪职业教育数字艺术规划教材:,4.3调整APDiv,(3)对齐APDIV使用APDIV对齐命令,可利用最后一个选定APDIV的边框来对其一个或多个APDIV。选中APDIV,之后单击菜单【修改】【排列顺序】,即可从弹出的子菜单中选择一种对齐方式。,- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 利用 APDiv 布局 页面
装配图网所有资源均是用户自行上传分享,仅供网友学习交流,未经上传用户书面授权,请勿作他用。
关于本文