Dreamweaver4简明教程(七、网页的排版3)

2016-02-19 19:53 1 1 收藏

最近很多朋友喜欢上设计,但是大家却不知道如何去做,别担心有图老师给你解答,史上最全最棒的详细解说让你一看就懂。

【 tulaoshi.com - Web开发 】

层的使用

  如果你觉得用表格对页面元素进行定位太难掌握,不妨尝试利用层(Layer)这个好东西。点击属性面板的  按钮,光标会成为一个十字,在编辑窗口上拖动,就可以创建出一个层,我们可以在层上输入绝大部分的网页元素,例如图片、文字等。层的好处是可以放置在页面的任何位置,如下图:

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

  选择一个层后,对应的属性面板如下:

  ① Layer ID:层的名称,用于识别不同的层;

  ② L,T:层的位置,L是距离页面左边界的距离,T是距离页面上边界的距离;
    W,H:层的宽和高;

  ③ Z-Index:层的Z轴顺序;

  ④ Bg Image:层的背景图;

  ⑤ Vis:层的显示状态,其中的Hidden是将层隐藏,处于不可见状态;

  ⑥ Bg Corlor:层的背景颜色;

  ⑦ Tag:层使用的代码方式,一般使用默认的DIV即可;

  ⑧ Overflow如果层里面的文字太多,或图片太大,层的大小不足以全部显示的时候,可以选择:
    visible:超出的部分照样显示;
    hidden:超出的部分隐藏;
    scrool:不管有否超出,都显示滚动条;
    auto:有超出时才出现滚动条;
 例如我们选择auto,那么以上例子中的层,在浏览时会显示为:

  层的优点很明显,但缺点也同样明显,例如难以制作一个适应不同分辨率的网页;当一个页面使用了多个层后,页面的复杂程度增加而导致编辑起来非常烦琐;编辑状态与浏览状态的实际效果有相当明显的差别等。通常人们是采用利用Layer进行排版,然后将层转换为表格的做法(Modefy Convert Layers to Table),具体操作在此就不多加叙述,大家可自己尝试一下。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

来源:https://www.tulaoshi.com/n/20160219/1622141.html

延伸阅读
标签: Web开发
八、为网页增添互动效果 制作简单的互动效果 在网页上经常看到这样的效果,当鼠标移到一张图片上的时候,原来的图片就切换为另一张图片,鼠标移开后,又恢复原来的模样,是怎么做的呢?在开篇的时候,提到Dreamweaver比Frontpage优胜的其中一个地方是Dreamweaver能做出能具互动性的网页。现在,我们就利用Dreamweaver制作这个最...
标签: Web开发
八、为网页增添互动效果 制作更复杂的互动效果 在Dreamweaver中,更复杂的效果是通过一个叫Behaviors的功能实现的,Behaviors的从字面上理解是“行为”,我们又称为事件的响应。通过网页元素的变化,如鼠标的移动、点击等“事件” (Events),触发弹出窗口,关闭页面等“响应”(Actions),就是一个事件的响应。而值得高兴的是,...
标签: Web开发
六、建立超级链接 超级链接(Link),简称链接,是页面与页面之间一个单向的关联关系。通过点击链接,我们可以从一个页面跳到另一个页面。我们可以在文字、图片建立链接。 1、文字链接 在页面中选取需要建立链接的文字,如下图: 在属性面板的Link一项,填写链接地址,当浏览者点击该链接的时候,浏览器就回跳转到...
FrontPage简明教程:网页布局 通常网页的布局使用到的是FrontPage中的表格和框架菜单栏里的命令。 表格(TABLE)是将页面中的内容以表格的形式排列,常用于单一页面内图片与文字的安排,是最常用的布局命令。 图3.1 框架(FRAMES)是在同一浏览器窗口中显示多个相互隔离的HTML页的结构。使用框架组织页面时,每个框...
标签: Java JAVA基础
  一、 什么是JSP JSP(JavaServer Pages)是由Sun Microsystems公司倡导、许多公司参与一起建立的一种动态网页技术标准,其网址为http://www.javasoft.com/products/jsp。在传统的网页HTML文件(*.htm,*.html)中加入Java程序片段(Scriptlet)和JSP标记(tag),就构成了JSP网页(*.jsp)。Web服务器在遇到访问JSP网页的请求时,首先执行其中的...

经验教程

623

收藏

16
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部