层精确定位与禁止表格称大.doc_第1页
层精确定位与禁止表格称大.doc_第2页
层精确定位与禁止表格称大.doc_第3页
层精确定位与禁止表格称大.doc_第4页
全文预览已结束

下载本文档

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

文档简介

层的精确定位招数一：表格定位法步骤1：打开Dreamweaver，新建一个页面，使用快捷键“Ctrl Alt T”插入一个两行一列的表格，配置第二行的目的就是为了放置层，使其相对表格定位。输入文字同时配置表格属性.步骤2：将光标移入第二行表格中，在这行中插入一个层，打开其属性面板，将L、T值删除，使其为空. 这两个参数绝对不能有数值，否则将不能实现层精确定位。当然这时的层参数已定，作为父层时该层是不能移动的，但能够使用光标改变其大小。步骤3：将光标定义在父层中，再次插入一个层并配置层内容。当您使用F2打开层控制面板时会看到位于父层底下的子层，作为子层是能够拖动的，因为他相对于父层定位。步骤4：为主菜单配置鼠标响应事件，显示当鼠标移到和离开该主菜单时层的显示方式就能够了。F12预览并改变分辨率，看看是否您的子菜单没有错置。招数二：CSS定位法上述方法毕竟不是专业设计师的期望，我们能够做一个CSS相对定位的定义方式，将相对定位模型(比如表格)定义为这个CSS属性。步骤1：使浏览器以相对定位模型左上角作为原点，建立新的坐标系。再在这个相对定位模型下级插入层，使之绝对于该相对定位模型定位。当然该层也是不可拖动的，改变其位置能够直接在其属性面板上输入Left Top的数值。步骤2：按“Shift F11”打开CSS Styles面板，点击“New Style”按钮，在弹出的New Style窗口中定义一个名称为.pos的CSS属性，并且选择Make Custom Style的Type类型和This Document 0nl的Define类型，确认进入Style Defintion For .pos窗口，选取Positioning定义Type为relative确定。 本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系。 步骤3：选取定义好的表格，右键点击CSS Style面板中的.pos，弹出菜单中执行Apply命令即可。使该相对定位模型(表格)建立新的坐标系，只要我们在其中插入层，并配置层内容和主菜单的鼠标响应事件就能够使层实现相对定位了。以上两招，大家不妨都试一试，若举一反三的话，一定能够做出各种使用层且自动适应用户分辨率配置的网页效果来表格被撑大单元格内容中出现不间断的英文或标点符号时就不会自动换行，表格被撑得很大，所以问题的关键在于配置让他自动换行或强制换行。具体步骤：给表格定义以下CSS属性：table-layout:fixed;word-wrap:break-word;word-break:break-all完整代码示例： 特别说明 本例用到表格的CSS属性table-layout、word-wrap和word-break属性。table-layout配置表格的布局算法。fixed：固定算法。word-break配置单词内的换行行为，特别是对象中出现多语言的情况。break-all:依照亚洲语言和非亚洲语言的文本规则，允许在字内换行，也允许非亚洲语
人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

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

最新文档

评论

0/150

提交评论