菜单控制下拉_第1页
菜单控制下拉_第2页
菜单控制下拉_第3页
全文预览已结束

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

菜单I控制I下拉浏览带有下拉菜单的网页时,我们经常会注意到当更改显示器分辨率时,其下拉菜单的位置并没有改变,这也是我们设计网页时容易忽略的一个问题,其实通过CSS控制页面元素精确定位后,这一点就不难实现了。建立主菜单栏新建页面,执行菜单“Insert/Table”命令打开“InsertTable”对话框,插入一个一行多列的表格,表格列数由你的菜单条目决定,同时设置“CellPadding〃、“CellSpacing〃以及“Border〃参数(如图1)。在建立的表格中输入主菜单导航文字,选取表格及文字后,用快捷键“Ctrl+F3〃打开其属性窗口,我们可以定义一个字体控制CSS来控制文字属性,调整相关参数。CSS实现相对定位菜单栏定义一个CSS相对定位的定义控制,将相对定位模型(菜单栏表格)定义为这个CSS属性。使浏览器以相对定位模型左上角作为原点,建立新的坐标系。再在这个相对定位模型下级插入层,使之相对于该相对定位模型定位。使用CSS控制后再

在表格中插入的层是不可拖动的,改变其位置可以直接在其属性面板上输入L、T的参数值。打开“CSSStyles〃面板,点击“NewStyle〃按钮,在弹出“NewStyle”窗口中定义一个名称为.pos的CSS属性,并且选择“MakeCustomStyle"的“Type"类型和“ThisDocumentOnl”的“Define"类型,''确认"进入“StyleDefintionFor.pos"窗口,选取“Positioning”定义Type为“Relative”确定。选取菜单栏表格,将该CSS控制添加到菜单栏所在的表格中。使该相对定位模型(表格)建立新的坐标系,只要我们在其中插入下拉菜单层,并设置层内容和主菜单的鼠标响应事件就可以使下拉菜单精确定位了。插入菜单栏目光标移入表格第一列,执行菜单“Insert/Layer”命令插入一个新层,作为“菜单一〃的下拉菜单,点击层内部,执行“Insert/Table〃命令,设定该表格行数、列数,并将表格线宽度设为“0〃,表格底色为喜好颜色,输入菜单项目文字,设定文字CSS控制效果,并调整菜单大小。以同样的方式做出其他下拉菜单图层效果。I劉埜)w詡〕卯1・、嚴di圧弘严厂一艇舀”QI劉埜)w詡〕卯1・、嚴di圧弘严厂一艇舀”Q粧吃迪"云i示匪IsYvseYCimB.T1n1皿山・4[「翼单吊日泗ihl■?■-Itfkil5牡v*L«-|rBrI、设置层属性和鼠标响应事件分别选中层Layer1、Layer2、Layer3、Layer4,在其属性窗口中把“Vis”项改为“Hidden〃,把这4个层隐藏。选择主菜单中的“菜单一〃,用快捷键“Shift+F3〃打开“Behaviors〃行为窗口,单击“+〃按钮,执行菜单“Show-HideLayers”命令,于弹出窗口中选择“Layer'Layer1‘”,点击“Show〃按钮,然后设置其两层为“Hide”。该动作表示把“Layer1〃显示,而其他层均隐藏。

最后点击“Behaviors”窗口“Events”下刚才定义的行为右侧的箭头,于弹出菜单中选择“onMo

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论